title: WPF Canvas not placing objects as expected
body: <p>I just began learning WPF and XAML, and I was taking a look at the things I could do in Blend.</p>
  
  <p>So what I tried was placing a rectangle in a grid.</p>
  
  <p>Grid size: 517x319 (auto)</p>
  
  <p>Rectangle size: 497x299 (auto)</p>
  
  <p>XAML:</p>
  
  <pre><code>&lt;Window x:Class="UITest.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:UITest"
          mc:Ignorable="d"
          Title="MainWindow" Height="350" Width="525"&gt;
      &lt;Grid&gt;
          &lt;Rectangle Fill="Black" Margin="10"/&gt;
      &lt;/Grid&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p>And it gave this output</p>
  
  <p><a href="https://i.stack.imgur.com/LpJTG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LpJTG.png" alt="enter image description here"></a></p>
  
  <p>But when I tried doing the same thing with a canvas,</p>
  
  <p>Canvas size: 517x319 (auto)</p>
  
  <p>Rectangle size: 497x299 (auto)</p>
  
  <p>XAML:</p>
  
  <pre><code>&lt;Window x:Class="UITest.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:UITest"
          mc:Ignorable="d"
          Title="MainWindow" Height="350" Width="525"&gt;
      &lt;Canvas&gt;
          &lt;Rectangle Fill="Black" Height="299" Width="497" Canvas.Left="10" Canvas.Top="10"/&gt;
      &lt;/Canvas&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p>it renders into</p>
  
  <p><a href="https://i.stack.imgur.com/Qte0k.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Qte0k.png" alt="enter image description here"></a></p>
  
  <p>And then I tried the same thing again... this time: Grid -> Canvas -> Rectangle, and this is what I got</p>
  
  <p>Grid size: 517x319 (auto)</p>
  
  <p>Canvas size: 497x299 (auto)</p>
  
  <p>Rectangle size: 477x279 (auto)</p>
  
  <p><a href="https://i.stack.imgur.com/ofnLN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ofnLN.png" alt="enter image description here"></a></p>
  
  <p>XAML:</p>
  
  <pre><code>&lt;Window x:Class="UITest.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:UITest"
          mc:Ignorable="d"
          Title="MainWindow" Height="350" Width="525"&gt;
      &lt;Grid&gt;
          &lt;Canvas Margin="10" Background="Black"&gt;
              &lt;Rectangle Fill="#FFF4F4F5" Height="279" Width="477" Canvas.Left="10" Canvas.Top="10" Stroke="Black"/&gt;
          &lt;/Canvas&gt;
      &lt;/Grid&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p>Why isn't the rectangle being placed in the center of the canvas?</p>