Skip to content

Standard Module Format

jhunter edited this page Feb 19, 2016 · 9 revisions

The standard module format is based on the YUI module control. I hope to include input from microformats and HTML5 communities to inform the choice of class names.

Property Description
mod Module is the wrapper for every container object. It provides basic structure for a transparent inside module. It can be extended by mojo or ag to provide for transparent outside and complex borders respectively.
inner Inner exists for two reasons. First, it solves a bug (Opera prior to version 8.5) in which position relative and overflow hidden cannot exist on the same element. Second, it allows for two elements on which borders can be placed to extend the number of blocks that can be built without using image based borders.
hd The module header generally contains a heading, but may also contain buttons, links, tabs, etc. hd provides basic structure and can be extended via skin classes. A module can have 0-1 (should this be 0-n?) hd.
bd The body is the main open editable region of the module. It is an obligatory region, the module may contain 1-n bodies.
ft The module footer is an object. ft provides basic structure and it can be extended via skin classes.
<div class="mod">
	<div class="inner">
		<div class="hd">head</div>
		<div class="bd">body</div>
		<div class="ft">foot</div>
	</div>
</div>