Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus feugiat neque in pede. Aliquam nec dui. Cras convallis euismod dolor. Quisque vulputate semper diam. Cras egestas accumsan erat. Duis vel lorem. Vestibulum pharetra convallis justo. Fusce at nisl. Integer malesuada lacus ac libero. Vivamus odio. Nam enim odio, euismod id, suscipit a, faucibus vitae, arcu.

2 Column, left Menu, Header & Footer

By declaring the DocType at the begginning of the file is STRICT, we can always ensure that most browsers behave the same way when measuring the size of a div and it's associated padding, margins and borders.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">

This means the div size adds in the width,padding, margin and borders. So whilst the main width of the design is 835px, because we have 10px border, the actual width is 845px.

The main content container is 600px wide with a real use of 579px, so when adding in images or tables, they should be no more then 579px wide.

Whenever we have multiple divs side by side we generally use the hack <br clear="all" /> to clear the divs and start again. You can also add in clear: all; to the div with the floating elements.

To center the maincontainer div in the middle of the sreen we use: margin: 0 auto;

Main Template

Stylesheets

There are three stylesheets assigned to this design:

screen.css

This stylesheet is only used for browsers when viewing on a screen.

styleone.css

This stylesheet is called for all devices

print.css

The print stylesheet is only called when the document is printed by a web browser print function.