Vertical Align in WPF TextBox

Question

I have 2 TextBoxes in my wpf app, one for user name and other for password, both have FontSize=20, but the text appears like this:

How can I fix this?

Xaml:

<TextBox Grid.Row="1" Grid.Column="1" Height="40" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Text="test" />
<PasswordBox Grid.Row="3" Grid.Column="1" Height="40" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Password="test" />

Solution 1

Adjust the Padding properties of these controls, e.g. Padding="0":

<TextBox Grid.Row="1" Grid.Column="1" Height="40" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Text="test" Padding="0" />  
<PasswordBox Grid.Row="3" Grid.Column="1" Height="40" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Password="test" Padding="0" />

Or, don't set the Height properties, and instead let the controls size themselves automatically based on the height of their content:

<TextBox Grid.Row="1" Grid.Column="1" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Text="test" />
<PasswordBox Grid.Row="3" Grid.Column="1" BorderThickness="1" BorderBrush="#FFD5D5D5" FontSize="36" Password="test" />

Solution 2

To vertically center the text in a TextBox use the VerticalContentAlignment property:

<TextBox Text="The text" Height="40" VerticalContentAlignment="Center" />

Solution 3

You have given explicit Height set to 40 to these TextBox controls.

Please remove it and let them take enough space to show their content.

<TextBox Grid.Row="1"
            Grid.Column="1"
            BorderThickness="1"
            BorderBrush="#FFD5D5D5"
            FontSize="36"
            Text="test" />
<PasswordBox Grid.Row="3"
                Grid.Column="1"
                BorderThickness="1"
                BorderBrush="#FFD5D5D5"
                FontSize="36"
                Password="test" />

Comments

[Gray Programmerz]

or VerticalContentAlignment = VerticalAlignment.Center;