title: Unable to Style TabControl
body: <p>Within my application, I have recently tried to jazz it up in terms of its appearance so I have tried using <code>MahApps.Metro</code>. But I've hit a little of a snag.</p>
  
  <p>Within my application, I have a <code>tabcontrol</code> and I have used a <code>style</code> as the following ;</p>
  
  <pre><code>&lt;Page.Resources&gt;
      &lt;ResourceDictionary&gt;
  
        &lt;ResourceDictionary.MergedDictionaries&gt;
           &lt;!--Resource dictionary for mahapps. --&gt;
        &lt;/ResourceDictionary.MergedDictionaries&gt;
  
        &lt;Style TargetType="{x:Type TabItem}"&gt;
           &lt;Setter Property="HeaderTemplate"&gt;
               &lt;Setter.Value&gt;
                   &lt;DataTemplate&gt; 
                       &lt;StackPanel Orientation="Horizontal"&gt;
                          &lt;!-- FormName is the name of the ViewModel--&gt;
                          &lt;TextBlock Text="{Binding FormName}" VerticalAlignment="Center" Margin="2" /&gt; 
                       &lt;/StackPanel&gt;
                       &lt;DataTemplate.Triggers&gt;
                          &lt;DataTrigger Binding="{Binding IsValid}"
                                   Value="False"&gt;
                          &lt;/DataTrigger&gt;
                       &lt;/DataTemplate.Triggers&gt;
                   &lt;/DataTemplate&gt;
               &lt;/Setter.Value&gt;                    
           &lt;/Setter&gt;                
       &lt;/Style&gt;
   &lt;/ResourceDictionary&gt;
  &lt;/Page.Resources&gt;
  
  &lt;!-- The itemsource that is bound to is a ObservableCollection of Forms that are used to validate for a Progress bar, It uses the ViewModels--&gt;
  &lt;TabControl x:Name="tabcontrol" 
              Grid.Row="1"  
              ItemsSource="{Binding Forms}"
              SelectedIndex="0" BorderBrush="Black" /&gt;
  </code></pre>
  
  <p>Obviously, this isn't using the <code>MahApps.Metro</code> <code>tabcontrol</code>. However, within the <code>style</code> of the <code>tabcontrol</code> I changed the <code>TargetType</code> to the following but it causes everything within the <code>Page</code> to increase its size and combines effectively two tab contents into one;</p>
  
  <pre><code>&lt;Style TargetType="{x:Type Controls:MetroTabItem}"  BasedOn="{StaticResource MetroTabItem}"&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/MunxK.jpg" alt="enter image description here"></p>
  
  <p>Any help would be grateful in regards to helping me implement the <code>MahApps.Meto</code> <code>tab control</code> and clearing up what I am doing wrong. Cheers.</p>