Initial Containing Block

The HTML element (the root element) in this document is 500px * 500px. It has 100px of padding on the left and right sides. This means that its medium solid purple border should enclose a box 700px wide and 500px tall. There should be boxes in the padding in the four corners of the box. However, the yellow background should cover the whole canvas.

This positioned element should be in the upper left corner of the HTML element.

This positioned element should be in the upper right corner of the HTML element.

This positioned element should be in the lower right corner of the HTML element.

This positioned element should be in the lower left corner of the HTML element.

(Back to CSS Testing Information, David Baron)

LDB, dbaron@dbaron.org