title: How to make the StackPanel or DockPanel stretch to fit their containers in WPF?
body: <p>I have a <code>Grid</code> as a root container with two columns defined (There's only one row).<br>
  The first column has flexible width and second column has 300px fixed width.<br>
  Next, I have placed a <code>ListBox</code> inside the second column to stretch both horizontally and vertically, i.e. to fill the entire second column.<br>
  Lastly, I have defined an Items Template for the <code>ListBox</code> to be a vertically oriented <code>StackPanel</code>, with one <code>DockPanel</code> and a couple of <code>TextBlock</code>s inside. </p>
  
  <pre><code>&lt;!-- Data template for ListBox --&gt;
  &lt;DataTemplate DataType="{x:Type entities:Track}"&gt;
    &lt;StackPanel Orientation="Vertical"&gt;
      &lt;DockPanel&gt;
        &lt;TextBlock DockPanel.Dock="Left" Text="Now playing" /&gt;
        &lt;TextBlock DockPanel.Dock="Right" Text="Time remaining" /&gt;
      &lt;/DockPanel&gt;
      &lt;TextBlock Text="{Binding Artist}" /&gt;
      &lt;TextBlock Text="{Binding Title}" /&gt;
    &lt;/StackPanel&gt;
  &lt;/DataTemplate&gt;
  
  ...
  
  &lt;ListBox 
    Grid.Column="1" 
    HorizontalAlignment="Stretch" 
    VerticalAlignment="Stretch" /&gt;
  </code></pre>
  
  <p>I have two questions:</p>
  
  <ol>
  <li>How do I make the <code>StackPanel</code> fill the entire width of the <code>ListBox</code>? Right now, it only takes enough space to accomodate the <code>DockPanel</code> and the <code>TextBlock</code>s inside. It won't fit the width of the <code>ListBox</code> or <code>ListBoxItem</code>.</li>
  <li>Next, how do I make the <code>DockPanel</code> fill the entire width of the <code>StackPanel</code>, i.e. its parent? What happens right now is that even if the width of the <code>TextBlock</code>s in the <code>StackPanel</code> exceed the width of the <code>DockPanel</code>, it won't stretch to match their width. </li>
  </ol>
  
  <p>Thanks for the help. </p>