views:

74

answers:

1

I have the following in my XAML:

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="7"/>
        <RowDefinition Height="57"/>
    </Grid.RowDefinitions>

    <TextBlock Grid.Row="0" FontSize="18">Title Text</TextBlock>

    <Rectangle Grid.Row="1" Margin="0,2" Height="3" HorizontalAlignment="Stretch" Fill="#ff000000"/>

    <Border Grid.Row="2" Margin="0" Padding="0" BorderBrush="Black" BorderThickness="1">
        <TextBlock Margin="0" Padding="0" FontSize="55">123</TextBlock>
    </Border>
</Grid>

The problem is that there is a space (about 10px) above the text in the bottom TextBlock. I can only seem to get rid of this space by using a much smaller font size.

Does anyone have an idea of why this space is showing up, and what I can do about it?

Thank you.

+1  A: 

I believe it is because the default VerticalAlignment on a TextBlock is Stretch. Try setting it to Center:

<TextBlock Margin="0" Padding="0" FontSize="55" VerticalAlignment="Center">123</TextBlock>

If you really need to nudge it up you could add a negative top margin.

Dan Auclair
That did solve the problem. Strange because I had tried setting VerticalAlignment to "Top", and that did nothing for the problem. Do you know why "Top" does not work, but "Center" does?
Sako73
"Top" actually would appear to work if the bottom row in your grid were something like 300px, instead of 57px. Because the bottom row is smaller than the actual height of the TextBlock (because of the large Font size), Center will just center it vertically over the row regardless of space. If the bottom row was not a fixed size and you still wanted it to stay at the top regardless, you would have to set it VerticalAlignment="Top" with a top margin of -15px or so to achieve the same effect.
Dan Auclair