Question

This is my XAML design

<Grid x:Name="ContentPanel2" Grid.Row="1" Background="Black" Height="440" Width="440">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <Border BorderThickness="0" Grid.Row="0"  Grid.Column="0" Background="White" />
            <Border BorderThickness="0" Grid.Row="0"  Grid.Column="1"  Background="White"  />
            <Border BorderThickness="0" Grid.Row="0"  Grid.Column="2"   Background="White"  />

            <Border BorderThickness="0" Grid.Row="1"  Grid.Column="0" Background="White" />
            <Border BorderThickness="0" Grid.Row="1"  Grid.Column="1"  Background="White"  />
            <Border BorderThickness="0" Grid.Row="1"  Grid.Column="2"   Background="White"  />

            <Border BorderThickness="0" Grid.Row="2"  Grid.Column="0" Background="White" />
            <Border BorderThickness="0" Grid.Row="2"  Grid.Column="1"  Background="White"  />
            <Border BorderThickness="0" Grid.Row="2"  Grid.Column="2"   Background="White"  />
        </Grid>

Here are the images

wvga image


wxga image


720pimage


This appears differently in each resolutions (wvga,wxga & 720p).
Anybody knows why this behaviour happens?
How to resolve this issue?

Answer 1

This is a known issue (thought it had another StackOverflow question but I couldn’t find it) with how the fractional pixels work out – you can see the background of the Grid showing through “gaps” between your items.

You can fix it by making the Background of the Grid White.