Visual Studio WPF designer wont line up

Ive done searching and i can't find anything on why my designer window does this.

http://i.imgur.com/bH4lU.png

and when i run it looks like this.

http://i.imgur.com/oOhYt.png

See how it is farther away on the right?

This makes building a window very annoying. How can i stop this?

<Window x:Class="WPF1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Main Window" Height="3开发者_运维技巧60" Width="547" ResizeMode="NoResize">
<Grid Background="#FF464646" Height="329">
    <ListBox Height="321" HorizontalAlignment="Left" Name="listBox1" VerticalAlignment="Top" Width="120" Background="#FF252525" />
    <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="126,298,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
    <ListBox Height="322" HorizontalAlignment="Left" Margin="393,0,0,0" Name="listBox2" VerticalAlignment="Top" Width="132" BorderBrush="White" Background="#FF252525" />
</Grid>

You have the 2nd ListBox left aligned with a 393 margin. Set the HorizontalAlignment to Right instead.

Judging by your xaml, it looks like you are using the Visual Studio designer to create this code. You should study up on WPF's layout system some more and this will all make sense. Currently your view is static, which means it won't resize with the parent element (i.e. when the Window resizes, all of the stuff stays in the same place). This is why you are seeing borders. You'll want to remove the Height, Width, and Margins on all of your elements, and set the HorizontalAlignment and VerticalAlignments accordingly to make your Window look right when it is resized.