Items in a horizontal StackPanel position incorrectly on remote device (Windows Store App)

85 Views Asked by At

I'm developing a Windows Store App for Windows 8.1 for use with a specific kind of Surface Pro tablet.

While in the Designer, I lined up two TextBlocks exactly as I wanted them using a horizontal StackPanel and ran them in the Simulator (1920x1080) and they were aligned properly. When the same app was exported to the device (1920x1080), the text slanted downward, with each additional TextBlock bringing each TextBlock after it down by 2px.

How can I ensure that the items in the StackPanel don't move themselves downwards on my device? Thanks!

<StackPanel Grid.Column="1" HorizontalAlignment="Left" Orientation="Horizontal" Margin="0,0,30,40" VerticalAlignment="Bottom">
                <TextBlock x:Name="pageTitle" Text="" Style="{StaticResource HeaderTextBlockStyle}" Grid.Column="1" 
                        IsHitTestVisible="false" TextWrapping="NoWrap" VerticalAlignment="Bottom" FontFamily="Global User Interface"/>
                <StackPanel Grid.Column="1" HorizontalAlignment="Left" Orientation="Horizontal" Height="30" Margin="20,0,0,0" VerticalAlignment="Bottom" Width="867">
                    <TextBlock Text="{Binding A}"  Style="{StaticResource SubheaderTextBlockStyle}" FontFamily="Global User Interface" HorizontalAlignment="Left" VerticalAlignment="Top" />
                    <TextBlock Margin="14,6,12,0" Text="&#xE097;" FontSize="18" FontFamily="Segoe UI Symbol" HorizontalAlignment="Left" VerticalAlignment="Top"/>
                    <TextBlock Text="{Binding B}" Style="{StaticResource SubheaderTextBlockStyle}" FontFamily="Global User Interface" VerticalAlignment="Top" HorizontalAlignment="Left" />
                    <TextBlock Margin="14,6,12,0" Text="&#xE097;" FontFamily="Segoe UI Symbol" FontSize="18" HorizontalAlignment="Left" VerticalAlignment="Top" />
                    <TextBlock Text="{Binding C}" Style="{StaticResource SubheaderTextBlockStyle}" FontFamily="Global User Interface" VerticalAlignment="Top" HorizontalAlignment="Left" />
                    <TextBlock Margin="14,6,12,0" Text="&#xE097;" FontFamily="Segoe UI Symbol" FontSize="18" HorizontalAlignment="Left" VerticalAlignment="Top" />
                </StackPanel>
            </StackPanel>
0

There are 0 best solutions below