Free Web Template: 2-Column Centered Flexible Width Website Template

A very common layout you find on the Web is a 2-column centered layout that flexes to match the current window width. This layout validates as XHTML 1.0 Strict, uses h1 and h2 tags for headlines and the main content area comes first on the page.

See The Template

Scroll down for instructions on how to get the files for this template.

Windows

• Firefox and Mozilla 1, 2, and 3
• Internet Explorer 6 and 7
• Opera 8.5 and 9
• Safari 3

Macintosh

• Firefox and Mozilla 1, 2, and 3
• Netscape 7
• Opera 9
• Safari 1, 2 and 3

• Container element is 80% of the browser window width.
• The container element will flex from 300px to 1000px so that it doesn't get too narrow or too wide to read.
• Columns are labeled as wide and narrow, to accomodate whatever content is placed in them
• Narrow column is 20% of the remaining space.

• Wide column is 75% of the remaining space.
• Columns can be switched to opposite sides by changing the floats in the CSS.
• Colored borders around each column are there to provide information, and don't need to be left in the final design.
• <h1> and <h2> headlines can be converted to <div> if more content is required, such as a logo.

1. Copy the CSS into a document named styles.css
2. Copy the HTML into a file in the same directory
3. Don't forget to add a title to the page
4. Publish all documents (HTML page, image, and CSS file)
5. If you want to add design changes - create another CSS file or add it to styles.css

• The XHTML
• The CSS

• Free website Templates
• Free Menu Templates
• Other website Templates

You are free to use any of the free Web templates here for personal or commercial designs, either in print or on the Web, excluding items for resale. You may not give away, sell, or redistribute the files in any way. Do not post these files on any another website, electronically distribute them, or include them in any package for distribution. If you find these files useful, please include a credit line or a link back to this site [http://webdesign.about.com/]. Terms of use last modified 12/07/2008.