Set layout to have 100% width and 100% height

Question

How can I set a layout to have 100% width and 100% height?

I want my Silverlight application to stretch in the browser to fill all space.

I am using Expression Blend 4.

Here is my XAML:

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="RichardKnopNew.MainPage"
    Width="960" Height="540">

    <Grid x:Name="LayoutRoot" Width="960" Height="540">
        <Grid.Background>
            <ImageBrush Stretch="Fill" ImageSource="/bg.jpg"/>
        </Grid.Background>
        <Rectangle Fill="#FF252525" Stroke="Black" Opacity="0.7" RadiusX="10" RadiusY="10" Margin="25,115,335,25" StrokeThickness="0" Height="400"/>
    </Grid>
</UserControl>

Answer 1

Your application should do this automatically. The only reasons why it would not do so are:

• You've constrained the size of the Silverlight object in the HTML page that hosts the application, or

• You've explicitly set the width/height of the MainPage object in MainPage.xaml.

Setting the Background property of the MainPage object to a non-white colour should demonstrate this. If not, please include more details (including the XAML you are using).

Hope this helps...

Chris