The style declarations contained within this page:
div.contain {position: relative; width: auto;
border: 2px dashed gray; color: gray; margin-bottom: 0.5em;}
div.contain * {color: black;}
div.contain span {position: absolute; top: 0; background: #FDA;}
.cl1 {left: 0;}
.cl2 {left: auto;}
.cl3 {left: 25%; right: 25%; width: 50%;}
.cl4 {left: 25%; right: 25%; margin-left: auto; margin-right: auto; width: 25%;}
.cl5 {left: 0; right: 0; margin-left: 25%; margin-right: auto; width: 25%;}
.cl6 {left: 0; right: 0;}
.cl7 {left: 10px; right: 10px;}
.cl8 {left: 10px; right: -10px;}
.cl9 {left: 25%; right: 25%; margin-right: 25%; margin-left: 25%; width: 25%;}
This paragraph contains a 'span' with a class of 'cl1' ([cl1]) that should appear in the top left corner of the containing block.
This paragraph contains a 'span' with a class of 'cl2' ([cl2]) that should appear at the top of the containing block with its left edge aligned with the position it would have been if the 'span' had not been positioned.
This paragraph contains a 'span' with a class of 'cl3' ([cl3]) that should appear at the top of the containing block with a width half that of the containing block, and centered horizontally within the containing block.
This paragraph contains a 'span' with a class of 'cl4' ([cl4]) that should appear at the top of the containing block with a width one-quarter that of the containing block, and centered horizontally within the containing block.
This paragraph contains a 'span' with a class of 'cl5' ([cl5]) that should appear at the top of the containing block with a width one-quarter that of the containing block, and with its right edge lined up with the hoizontal midpoint of the containing block.
This paragraph contains a 'span' with a class of 'cl6' ([cl6]) that should appear at the top of the containing block with a width equal to that of the containing block, centered within it.
This paragraph contains a 'span' with a class of 'cl7' ([cl7]) that should appear at the top of the containing block with a width 20 pixels less than that of the containing block, and with its right and left edges inset 10 pixels from each edge of the containing block.
This paragraph contains a 'span' with a class of 'cl8' ([cl8]) that should appear at the top of the containing block with a width equal to that of the containing block, but shifted 10 pixels to the right.
This paragraph contains a 'span' with a class of 'cl9' ([cl9]) that should appear at the top of the containing block with a width one-quarter that of the containing block, its left edge lined up with the horizontal midpoint of the containing block, and its right edge 25% inset from the right edge of the containing block.