How do I get rid of the extra margin around a Button?

Question

I'm working with XAML in Windows 8 Metro.

I have a grid with multiple rows. The first row contains a button, and the second an image. The image is a full 600 units wide, and the button has an image content. The problem is that no matter how I style the button, its left edge doesn't match the left edge of the image. While poking around with the settings, it looks like the button includes an extra margin outside of the border, even though I've set the margin (and padding, and border thickness) of the button to 0.

Where does this border come from? How do I get rid of it? I tried creating a custom style with a Template value (below) but it ignores my other style settings. I couldn't find much useful documentation on how to build the template -- or even if that is the problem.

<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="Button">
            <Grid>
                <ContentPresenter Content="{TemplateBinding Content}" Margin="0" />
            </Grid>
        </ControlTemplate>
    </Setter.Value>
</Setter>

Answer 1

It is really annoying. The solution that seems to work for me is:

<Button Background="Crimson" 
    HorizontalAlignment="Stretch" 
    VerticalAlignment="Stretch" 
    BorderThickness="0" 
    Margin="-3">Click me!</Button>

The secret is in the negative value of margin.