Let's start making this stuff look like our sketch!
You'll notice in our XHTML markup that each of our div tags has an ID name. The div tags that are going to be our three columns are wrapped inside an outer div called container2, the main and the left columns are wrapped in a div called container3, and the entire set of divs, including the header and footer, are wrapped in a main div tag called
container.
This structure is what's going to hold our content together and display WordPress semantically with the main content first. Along with this it also lets the style allow the left column to show up on the left. This structure also ensures that the footer stays at the bottom of the longest column.
In the stylesheet, I've set up my basic CSS positioning like the following:
body {
margin: 0px;
margin-top: 10px;
font-size: 0.8em;
line-height: 1.5em;
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #666;
}
#container {
margin: 0 auto;
width: 930px...