Introduction/2 Column CSS Templates

The following css templates are all constructed using XHTML1.0 and CSS2.
Templates marked with are ones I recommend.

Please note: these css templates are a learning tool and should be thoroughly tested before being used on a ‘production’ web site.

The templates are valid CSS2 and XHTML1.0 Transitional and have been tested on WinXP with IE6, Opera 7.11 and Mozilla 1.5b as well as Firefox 0.8 & Netscape 7.1 (which are basically the same as Mozilla).

CSS Templates: Two column |  Three column |  General

Buy professional ready-made templates

Two Column Flexible

Browsers: ‘ ‘ ‘ ‘ ⁽⁵⁺⁾

Description: Probably the easiest page to make. Contains two layout divs, the main content div is just floated to the left. Very simple!

Actions: View | Image Preview | Download [ 5k] [ZIP]

Two Column Flexible With Header

Browsers: ‘ ‘ ‘ ‘ ⁽⁵⁺⁾

Description: Basically the same template as above but with the addition of a header div for page title, your logo or banners etc. Again very simple to set up.

Actions: View | Image Preview | Download [ 3k] [ZIP]

Two Column, Left Column Static

Browsers: ‘ ‘ ‘ ‘ ⁽⁵⁺⁾

Description: Two columns, the left column is absolutely positioned on the left and is a fixed width. The right content column is sized and positioned by using margins and will resize with the browser window.

Actions: View | Image Preview | Download [ 6k] [ZIP]

Two Column, Left Column Static, with Header Bar

Browsers: ‘ ‘ ‘ ‘ ⁽⁵⁺⁾

Description: This is the same template as above but with the addition of a simple header bar which can be used for links, search box etc..

Actions: View | Image Preview | Download [ 6k] [ZIP]

Two Column Fixed Width with Header & Footer

Browsers: ‘ ‘ ‘ ‘ ⁽⁵⁺⁾

Description: A fixed width centered page with a header, footer, left navigation column and right content column. One of my favourites.

Actions: View | Image Preview | Download [ 6k] [ZIP]