Visual formatting model

display : none | inline | block | inline-block | list-item | run-in | compact | marker | table | inline-table | table-row-group | table-header-group | tablefooter-group | table-row | table-column-group | table-column | table-cell | table-caption;

• none : Element is not visible and does not affect layout.
• Tips and FAQs
  • display: none; is used to make invisibile an element, removing it completely from page layout (visibility style is similar, but it does not remove the element from layout). Cannot be overridden on th descendants.
  • display: inline; is used to transform block elements to inline elements, for example to horizontally arrange list items.
  • display: block; is used to transform inline elements to block elements, for example to avoid mysterious gap problem (TODO : insert here link to E. Meyer article).

position : static | relative | absolute | fixed;
P: IE4+ NS4+ S: NS7+ O5+ Gecko

• static : Normal box, laid out according tonormal flow.
• relative : Normal box, laid out according tonormal flow, but with a fixed offset.
• absolute : Box is taken out of normal flow (does not affect other blocks layout) and absolutely positioned with respect to the containing block.
• fixed : Box is taken out of normal flow (does not affect other blocks layout) and absolutely positioned with respect to the viewport (does not move when scrolled).

top : length | percentage | auto; P: IE4+ MacIE4 B: NS4 S: IE5.5+ MacIE5 NS6+ O5+ Gecko
right : length | percentage | auto; S: IE5.5+ MacIE5 NS6+ O5+ Gecko
bottom : length | percentage | auto; S: IE5.5+ MacIE5 NS6+ O5+ Gecko
left : length | percentage | auto; P: IE4+ MacIE4 B: NS4 S: IE5.5+ MacIE5 NS6+ O5+ Gecko

• Relativeely positioned blocks
  • top : This is the offset with respect to top edge of block itself after placement in normal flow.
  • right : This is the offset with respect to right edge of block itself after placement in normal flow.
  • bottom : This is the offset with respect to bottom edge of block itself after placement in normal flow.
  • left : This is the offset with respect to left edge of block itself after placement in normal flow.
• Absolutely positioned blocks
  • top : Position of box top margin from top margin of containing block.
  • right : Position of box right margin from right margin of containing block.
  • bottom : Position of box bottom margin from bottom margin of containing block.
  • left : Position of box left margin from left margin of containing block.

float : left | right | none;
B: IE4+ MacIE4 B: NS4 S: IE5.5+ MacIE5 NS6+ O3.5+ Gecko

clear : none | left | right | both;
B: IE4 MacIE4 B: NS4 S: IE5+ MacIE5 NS6+ O5+ Gecko

z-index : auto | integer;
S: All

• integer : Stack level of the generated box in the current stacking context (default value is 0). A new local stacking context is created for the block.
• auto : The box uses the same stack level of the parent and does not create its own stacking context.

direction : ltr | rtl;
unicode-bidi : normal | embed | bidi-override;