title: How to remove gap between Grid columns in XAML (Windows Store app)
body: <p>I'm building a UI in XAML for a Windows Store app; it uses two background graphics in adjacent columns.  The XAML is as follows:</p>
  
  <pre><code>        &lt;Grid&gt;
              &lt;Grid.ColumnDefinitions&gt;
                  &lt;ColumnDefinition Width="*" /&gt;
                  &lt;ColumnDefinition Width="11" /&gt;
              &lt;/Grid.ColumnDefinitions&gt;
              &lt;Image Source="/Assets/stop-title-background-strip.png" Stretch="Fill" /&gt;
              &lt;Image Grid.Column="1" Source="/Assets/routes-chevron.png" Stretch="Fill" /&gt;
              &lt;TextBlock Text="Available Routes" /&gt;
          &lt;/Grid&gt;
  </code></pre>
  
  <p>However, when this is rendered, there is an obvious tiny gap between the columns:</p>
  
  <p><img src="https://i.stack.imgur.com/3DN3s.png" alt="enter image description here"></p>
  
  <p>I've tried setting the UseLayoutRounding attribute of the Grid and Image elements to "true"  (and false) but this doesn't fix the problem.</p>
  
  <p>How can I stop this gap appearing?</p>