WebBrowser strange behaviour with margins

Question

I'm developing a Windows Phone app.

I have a user control with the following XAML code:

<UserControl x:Class="XXXXXXX.Views.SignIn.FacebookControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    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="768" d:DesignWidth="480">

    <Grid x:Name="LayoutRoot" Background="{StaticResource PhoneChromeBrush}">
        <!--ContentPanel. Colocar aquí el contenido adicional-->
        <Grid x:Name="ContentPanel" Margin="12,0,12,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
            <TextBlock
                Grid.Row="1" 
                Height="30" 
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Visibility="Visible" 
                Margin="10"
                Name="LoadingText"
                Text="{Binding Path=AppResources.BrowserNavigating, Source={StaticResource LocalizedStrings}}"/>
            <phone:WebBrowser
                Grid.Row="0"
                Name="FacebookLoginBrowser"
                IsScriptEnabled="True"
                Height="607"
                VerticalAlignment="Top"
                HorizontalAlignment="Stretch"
                Margin="0,10"
                Navigated="FacebookLoginBrowser_Navigated"
                Loaded="FacebookLoginBrowser_Loaded"
                Navigating="FacebookLoginBrowser_Navigating"/>
        </Grid>

    </Grid>
</UserControl>

I'm a get this:

WebBrowser margin error

WebBrowser has a left margin, bigger than its right margin.

UPDATE

And this is how I'm embedding my user control:

facebookControl = new FacebookControl();
facebookControl.SetValue(Grid.RowSpanProperty, 2);
facebookControl.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
facebookControl.VerticalAlignment = System.Windows.VerticalAlignment.Top;
facebookControl.Margin = new Thickness(0);
facebookControl.Height = 768;
facebookControl.Width = 480;
ContentPanel.Children.Add(facebookControl);

And this is the definition for ContentPanel:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
...

How can I fix this?

Your line Margin="0,10" may have something to do with it. Have you tried setting it to a single number so that all the margins are the same? — johnhforrest
@johnhforrest: I've changed to 0 and I get the same problem. — VansFannel

Matt Lacey Matt Lacey · Accepted Answer · 2011-04-13T16:32:43

Your ContentPanel grid has margins (of 12px) on both sides but the right one is not as obvious with the performance counters displayed. Is this the issue?

WebBrowser strange behaviour with margins

2 Answers