This profile is about properties for the class attribute, regarding the structure of a single web page.


The canvas container identifies the complete drawable area (the complete window).

There is a difference in what the rendering area is in xhtml and html. For html the rendering area is defined by the body element. For any xml, the rendering area is the root element, so for xhtml this is the html element. If styling the body element in an xhtml document, if the content does not fill the whole window the unoccupied area is left blank. This ist different to html where the whole window is styled then. To be able to use the same css stylesheet for both html and xhtml, you have to apply the root style to the body element for html, and to the html element for xhtml. Thsi is achieved by using a trick: The style is applied to html as well as to body class="canvas". In html styling the html element simply has no effect. In xhtml the body element does not get this class, and so the style is only applied to the html element.

The container of this class will contain any visible header information, This will most often be the title of the page and/or a logo. It may also contain the skiplink source and optionally some more navigational aids.

This container contains the main page navigation. In most cases those navigation elements within this container will be grouped together in a list.


This is the main container for the main contents. Within this container all of the main information can be found.


This container is an optional subcontainer for the main container.


A container for additional notes.

This may be used as a sidebar for side notes or as subcontainer for the main or contents containers.

Container for footnotes and technical information.

Container (usually a list) containing the breadcrumb navigation.