WPF: Creating overlapping rectangles using canvas

This entry is part 53 of 54 in the series Learn WPF

The following example produces three Rectangle elements, each element 100 pixels. The first Rectangle is red, and its upper-left (x, y) position is specified as (0, 0). The second Rectangle is green, and its upper-left position is (100, 100), which is just below, and to the right of, the first square. The third Rectangle is blue, and its upper-left position is (50, 50).

<Window x:Class="Ellipse.MainWindow"
        Title="MainWindow" Height="350" Width="525">
    <Canvas Height="400" Width="400">
        <Canvas Height="100" Width="100" Top="0" Left="0" Background="Red"/>
        <Canvas Height="100" Width="100" Top="100" Left="100" Background="Green"/>
        <Canvas Height="100" Width="100" Top="50" Left="50" Background="Blue"/>