title: Center the Button Text Content in a universal app
body: <p>I am trying to center the text Content of a Button in Center,in my universal app,but this is what I get:</p>
  
  <p><a href="https://i.stack.imgur.com/KKGhB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KKGhB.png" alt="enter image description here"></a></p>
  
  <p>and this is my code:</p>
  
  <pre><code>&lt;StackPanel Orientation="Vertical"  &gt;
                          &lt;Border  VerticalAlignment="Center" Height="40"  &gt;
                              &lt;Button  Background="Transparent" Content="Resultats" FontSize="16" VerticalAlignment="Stretch" Foreground="#727271"  x:Name="res" Style="{Binding Source={StaticResource ButtontopStyle}}" HorizontalAlignment="Stretch"  Click="res_Click" HorizontalContentAlignment="Left"  VerticalContentAlignment="Center" Height="40"/&gt;
                          &lt;/Border&gt;
                          &lt;StackPanel x:Name="stackVisible" Orientation="Vertical" &gt;
                          &lt;Border Margin="0" &gt;
                                  &lt;Button  Background="Transparent" Content="Tous les résultats" FontSize="14" VerticalAlignment="Top" Foreground="#727271" Margin="0"  x:Name="ttres" Style="{Binding Source={StaticResource ButtonMenuStyle}}"  HorizontalAlignment="Stretch" HorizontalContentAlignment="Left" Padding="10" VerticalContentAlignment="Center" Height="40"/&gt;
                          &lt;/Border&gt;
                          &lt;Border&gt;
                                  &lt;Button Background="Transparent" Content="Recherches Avancées" FontSize="14" VerticalAlignment="Top" Foreground="#727271" Margin="0"  x:Name="rechavan"  HorizontalAlignment="Stretch" Style="{Binding Source={StaticResource ButtonMenuStyle}}" HorizontalContentAlignment="Left" Padding="10" VerticalContentAlignment="Center" Height="40"/&gt;
                          &lt;/Border&gt;
                          &lt;/StackPanel&gt;
            &lt;/StackPanel&gt;
  </code></pre>
  
  <p>I tried to use VerticalContentAlignment="Center",but like you see,I didn't get the result that I want
  thanks for help</p>
  
  <p>my styles for buttons:</p>
  
  <pre><code>&lt;Style  x:Key="ButtonMenuStyle" TargetType="Button"&gt;
              &lt;Setter Property="Foreground" Value="#e6e6e6"/&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="Button"&gt;
                          &lt;Grid&gt;
                              &lt;VisualStateManager.VisualStateGroups&gt;
                                  &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                      &lt;VisualState x:Name="Normal"/&gt;
                                      &lt;VisualState x:Name="PointerOver"&gt;
                                          &lt;Storyboard&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Border" /&gt;
                                          &lt;/Storyboard&gt;
                                      &lt;/VisualState&gt;
                                      &lt;VisualState x:Name="Pressed"&gt;
                                          &lt;Storyboard&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Border" /&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Content" /&gt;
                                          &lt;/Storyboard&gt;
                                      &lt;/VisualState&gt;
                                  &lt;/VisualStateGroup&gt;
                              &lt;/VisualStateManager.VisualStateGroups&gt;
                              &lt;Grid&gt;
                                  &lt;Rectangle x:Name="Border" Stroke="Transparent" Fill="Transparent" Margin="0"/&gt;
                                  &lt;ContentPresenter x:Name="Content"/&gt;
                              &lt;/Grid&gt;
                          &lt;/Grid&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
          &lt;Style  x:Key="ButtontopStyle" TargetType="Button"&gt;
              &lt;Setter Property="Foreground" Value="#e6e6e6"/&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="Button"&gt;
                          &lt;Grid&gt;
                              &lt;VisualStateManager.VisualStateGroups&gt;
                                  &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                      &lt;VisualState x:Name="Normal"/&gt;
                                      &lt;VisualState x:Name="PointerOver"&gt;
                                          &lt;Storyboard&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Button" /&gt;
                                          &lt;/Storyboard&gt;
                                      &lt;/VisualState&gt;
                                      &lt;VisualState x:Name="Pressed"&gt;
                                          &lt;Storyboard&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="Button" /&gt;
                                              &lt;ColorAnimation Duration="0" To="#e6e6e6" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Content" /&gt;
                                          &lt;/Storyboard&gt;
                                      &lt;/VisualState&gt;
                                  &lt;/VisualStateGroup&gt;
                              &lt;/VisualStateManager.VisualStateGroups&gt;
                              &lt;Grid&gt;
                                  &lt;Rectangle x:Name="Button" Stroke="Transparent" Fill="Transparent" Margin="0"/&gt;
                                  &lt;ContentPresenter x:Name="Content"/&gt;
                              &lt;/Grid&gt;
                          &lt;/Grid&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
  </code></pre>