The recommended method for laying out or structuring documents are to use Styles. Styles provide precise measurements when placing information in a document. Styles can control how content, including blocks of text, images and sections of documents, are displayed on the page.
A common tag used to block sections of the document is the <div> tag. The Floating Layer Example above is created using the following:
<div style="position: absolute; left: 450px; top: 85px; width: 170px; color: #D1EEFC; background: #321321; padding: 4px; border: 3px outset #D1FCEE;>Layer Example</div>
What this style definition does is absolutely position the contents of the DIV tag 450 pixels off of the left margin and 85 pixels off of the top of the container block, which in this case is the document itself or the BODY tag. It then sets the text colour and the background colour using hexidecimal numbering. Padding is added to give the content 4 pixels of space from the edge of the block and the places a 4 pixel border that uses an outset style and a colour.
Containing blocks of content in layers have many uses including; applying styles to blocks of content, positioning content in the document, layering content and controlling depth, and many other uses.
Updated December 1, 2007
