How to Build a 3-Column Layout in CSS

Now that we've got the rest of the page styled, you can add in the footer. I just use a last div with a "footer" id, and add content so that you can see it. I also added a border on the top, so you'll know where it starts.

The HTML:

<div id="footer"><p>Copyright © 2008 </p></div>

The CSS:

#container #footer {
  float: left;
  width: 870px;
  border-top: #c00 solid 3px;
}

Index: How to Build a 3-Column Layout in CSS

1. Draw Your Layout
2. Write Basic HTML/CSS and Create a Container Element
3. Style the Container
4. Use a Headline Tag for the Header
5. To Get 3 Columns, Start By Building 2 Columns
6. Then Add 2 Columns Inside the Wide Second Column
7. Add in the Footer
8. Add in Your Personal Styles and Content
9. The Final HTML/CSS