5 Column DIV Layout Creator - margin style


Change class names in HTML code or auto change. Back to default
Include <style> tags Full HTML code

Editor Panel

Layout unit
px em %
Body font-size
Body font unit
main body

What's the difference?

This design has one container div and the columns are seperated by margins between the columns .

Here we avoid the double margin bug of IE6.

Where the layout be used?

This layout is preferred being used to design in-page 5 column tables. It can be used as a creator for 5 columns tableless table.

liquid or fixed?

Both fixed width column and liquid column work well by this design. Be careful of using em because em layout is relevant to the font-size defined in body tag.

the Height

Normally, you don't have to set height values. The height of the columns will extend with the content. Of course, it's an easy thing to set height values.