Hopefully these concepts are familiar to you from CSS. Any
control has these two attributes. Margin is the distance between a control and
its children and Padding is the distance between the outer edge of a control
and its children. Padding can be applied to three elements: Block, Border and
Control since these elements have an outer edge.
As with Margin in CSS, you can have Margin values for Left,
Top, Right and Bottom via abbreviated syntax with this order: Left, Top, Right
and Bottom.
Listing 10 is a modified version of Listing 8 to show the
concept of a Margin in action and Figure 10 shows is its output.
Listing 10
<Window x:Class="LayoutinXAML.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Layout in XAML" Height="150" Width="300"
>
<Grid ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBox Background="Coral" Grid.Row="0" Margin="10">
ASP Alliance 1
</TextBox>
<TextBox Background="Plum" Grid.Row="0" Grid.Column="2"
Margin="0 10 0 10">
ASP Alliance 2
</TextBox>
<TextBox Background="Aquamarine" Grid.Row="1" Grid.Column="0"
Margin="10 0 10 0">
ASP Alliance 3
</TextBox>
<TextBox Background="Teal" Grid.Row="1" Grid.Column="1"
Margin="0, 0, 10, 10">
ASP Alliance 4
</TextBox>
</Grid>
</Window>
Figure 10