Silverlight Grid inside of TabItem header

My custom TabItem header looks like this:

<sdk:TabControl>
    <sdk:TabItem >
        <sdk:TabItem.Header>
             <Grid Background="Gray" HorizontalAlignment="Stretch">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition></ColumnDefinition>
                     <ColumnDefinition></ColumnDefinition>
                 </Grid.ColumnDefinitions>
                 <!-- some labels go here -->
             </Grid>
        </sdk:TabItem.Header>
     </sdk:TabItem>
</sdk:TabC开发者_运维问答ontrol>

This creates a single-row, two-column grid inside of the TabItem header. The grid automatically sizes to fit the labels, like it should, but when the size of the actual tab button grows, the grid does not adjust to fill the space (even though I specifiy <HorizontalAlignment="Stretch">).

Why is this? Is there a way to have the grid take up all available horizontal space in the header?

The problem is that the default template for a TabItem which is used to render the tab places the content of the header in a ContentControl. Now a ContentControl has the properties HorizontalContentAlignment and VerticalContentAlignment that have the default values of "Left" and "Top". This is why your grid only occupies the space it needs rather than stretching to the full size available.

In order to avoid this you will need to make a copy of the default template for the TabItem and assign the value "Stretch" to both of those properties on the ContentControl elements in the template (there are 8 in all, 2 for each possible TabStrip placement (Top, Left, Bottom and Right) ).