title: XAML Path sizing and positioning
body: <p>I am trying to design a template for a TabItem using paths and rectangles.  The sides of the tab layout are paths to accommodate curves in the design.  I am having a problem with getting the sides to line up/resize correctly.  Here's my XAML:</p>
  
  <pre><code>&lt;StackPanel Orientation="Horizontal"&gt;
   &lt;Path Stretch="UniformToFill" Fill="#FF000000" Data="F1 M 97.1985,101.669L 104.824,95.0005C 105.574,94.3338 106.921,93.8627 107.824,93.9171L 107.824,101.667L 97.1985,101.669 Z "/&gt;
   &lt;Grid&gt;
            &lt;Rectangle Grid.Column="1" Fill="#FF000000"/&gt;
    &lt;ContentControl Grid.Column="1" x:Name="HeaderTopSelected" FontSize="{TemplateBinding FontSize}" Foreground="{TemplateBinding Foreground}" IsTabStop="False" Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}"/&gt;
   &lt;/Grid&gt;
   &lt;Path Stretch="UniformToFill" Fill="#FF000000" Data="F1 M 118.714,101.678L 111.088,95.0097C 110.338,94.343 108.991,93.8719 108.088,93.9264L 108.088,101.676L 118.714,101.678 Z "/&gt;
  &lt;/StackPanel&gt;
  </code></pre>
  
  <p>(I apologize for the lack of line breaks.  I'm new to StackOverflow and don't know how to insert them, nor do I have the time to figure it out :D)</p>
  
  <p>The code snippet posted <em>almost</em> works:  The side paths are the correct size, but they do not display in a line, they overlap behind the rectangle/next element.  If I set a fixed width they work as well, but I can't set the width as fixed, they need to be fluid in case the content of the tab exceeds the basic height.</p>
  
  <p><a href="http://gallery.me.com/georgeloring/100172/Ryan" rel="nofollow noreferrer"><strong>This is an idea of what I would like to get</strong></a>
  <br/>
  The sides (paths) grow uniformally based on the height of the ContentControl</p>