UserControl Grid get's displayed with Portrait sizing in Landscape mode

I have this XAML for a UserControl:

<UserControl x:Class="SW.Resources.Controls.HistoryProgressBox"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="480" d:DesignWidth="480">

<Grid x:Name="LayoutRoot" Style="{StaticResource AppBackgroundStyle}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="223" />
        <ColumnDefinition Width="223" />
        <ColumnDefinition Width="10" />
    </Grid.ColumnDefinitions>

    <TextBlock x:Name="TitleText" Style="{StaticResource TitleListItemStyle}" Text="41xxfd" TextWrapping="Wrap" Grid.ColumnSpan="2"/>
    <TextBlock x:Name="leftValue"  HorizontalAlignment="Right" Style="{StaticResource DetailListItemStyle}" Text="Category: " Grid.Row="1" Grid.Column="0"/>
    <TextBlock x:Name="rightValue" Style="{StaticResource DetailListItemValueStyle}" Text="tv" Grid.Row="1" Grid.Column="1" />
    <TextBlock x:Name="subLeftValue" HorizontalAlignment="Right" Style开发者_运维百科="{StaticResource DetailListItemStyle}" Text="Size: " Grid.Row="2" Grid.Column="0" />
    <TextBlock x:Name="subRightValue" Style="{StaticResource DetailListItemValueStyle}" Text="400MB" Grid.Row="2" Grid.Column="1"  />
    <Rectangle Fill="Red" x:Name="progressColor" Grid.RowSpan="4" Grid.Column="2"/>
</Grid>

It looks exactly as I want it to in Portrait. But in landscape, the control ends early. Ideally I would have this control stretch to cover the entire screen. Is this possible to do without having to do any extra code to handle the switch to Landscape?

If you put it inside another grid on the page it should resize to fit the page.

You may want to use percentage based column widths so the columns also resize.

e.g.

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="223*" />
    <ColumnDefinition Width="223*" />
    <ColumnDefinition Width="10*" />
</Grid.ColumnDefinitions>