Why Doesn't Visual Studio's Designer Match What I See At Runtime?

Question

I'm new to WPF and using Visual Studio (2015)'s Design view to create a sample application. At design time, everything looks pretty much like what I want:

But when I run the application, it looks quite different.

I found a similar, but not quite the same question (Run time View of WPF Window doesn't match the Design View of Expression Blend) with layouts created in Blend not matching at runtime. And this question (Different look in design-mode and at runtime) but that was involving a dynamic resource.

I'm not doing anything clever, just a grid and the controls. I haven't modified any appearances with templates. I've used the drag and drop functionality so my grid might be a little sloppy...but I'd really expect it to match.

Am I doing something wrong? It seems crazy that the designer wouldn't match the runtime...below is my code.

<Window x:Class="Chap01_01.MainWindow"
        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"
        xmlns:local="clr-namespace:Chap01_01"
        mc:Ignorable="d"
        Title="Customer" Height="160" Width="350" ShowInTaskbar="true" ResizeMode="NoResize" Topmost="True" WindowStartupLocation="CenterScreen">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="35"/>
            <RowDefinition Height="35"/>
            <RowDefinition Height="25"/>
            <RowDefinition Height="100*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="87"/>
            <ColumnDefinition Width="85"/>
            <ColumnDefinition Width="43"/>
            <ColumnDefinition Width="35"/>
            <ColumnDefinition Width="94"/>
        </Grid.ColumnDefinitions>
        <Label Content="_First Name" Grid.Column="0" Grid.Row="0" Margin="5,5,5,5" Target="{Binding ElementName=firstName}" VerticalAlignment="Center" />
        <TextBox x:Name="firstName" Grid.Column="1" Grid.Row="0" Margin="5,5,5,5" VerticalContentAlignment="Center" Grid.ColumnSpan="4"/>

        <Label Content="_Last Name" Grid.Column="0" Grid.Row="1" Margin="5,5,5,5" Target="{Binding ElementName=lastName}" VerticalAlignment="Center" />
        <TextBox x:Name="lastName" Grid.Column="1" Grid.Row="1" Margin="5,5,5,5" VerticalContentAlignment="Center" Grid.ColumnSpan="4"/>

        <RadioButton x:Name="radioButton" Content="EU Citizen" Grid.Column="1" Margin="5,5,5,5" Grid.Row="2" VerticalContentAlignment="Center" Grid.ColumnSpan="2"/>
        <RadioButton x:Name="radioButton2" Content="Non EU Citizen" Grid.Column="3" Margin="5,5,5,5" Grid.Row="2" VerticalContentAlignment="Center" Grid.ColumnSpan="2"/>
        <Button x:Name="okay" Content="Okay" Grid.Column="4" HorizontalAlignment="Right" Margin="0,0,5,5" Grid.Row="3" VerticalAlignment="Bottom"  Width="75"/>
        <Button x:Name="cancel" Content="Cancel" Grid.Column="2" HorizontalAlignment="Right" Margin="0,0,0,5" Grid.Row="3" VerticalAlignment="Bottom"  Width="75" Grid.ColumnSpan="2"/>
    </Grid>
</Window>

Answer 1

I couldn't really find anything to say WHY...but I did find a word-around.

Add SizeToContent="WidthAndHeight" in your window attributes...Mine looked delicious in both preview and debug.