Adjust Canvas inside a Grid in WPF

Question

I'm having trouble to adjust the Canvas inside the Grid in WPF. I want it to have a 10px margin from the Right and Top sides of the Grid . What am I doing wrong in the below code?

<Window x:Class="Layout2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Grid x:Name="DrawingArea" Background="Black">
        <Canvas x:Name="InformationLayer" 
                    Background="White" 
                    HorizontalAlignment="Right"
                    VerticalAlignment="Top"
                    Right="10"
                    Top="10"
                    Width="200" Height="30" >
        </Canvas>
    </Grid>
</Window>

Answer 1

Right and Top are attached properties of the Canvas class that position an element within a parent Canvas object. I do not believe they have a semantic meaning when used in the Canvas tag itself (unless of course you are nested in a canvas).

Instead, use the margin property:

   <Canvas x:Name="InformationLayer" 
                Background="White" 
                HorizontalAlignment="Right"
                VerticalAlignment="Top"
                Margin="0,10,10,0"
                Width="200" Height="30" >
    </Canvas>

Margins are formatted as "Left, Top, Right, Bottom" in case you need to modify!