Designing without tables by using CSS layouts is fast
becoming the new standard on the Web because of the
benefits mentioned in my previous article. Web browsers
used these days are now able to render web pages
proficiently. In this article I will endeavor to create a
basic 2 column CSS layout which you can use for future
design projects.
Here is the live web page of the basic CSS layout:
http://www.isitebuild.com/css/css-layout.html
1. Divide your page into sections - the
tags
allows you to create distinct divisions on your web page.
They are identified with a unique id. You can then add a
style (css selector) that specifically applies to the div
of that id. Remember to include the DOCTYPE (to render your
page accurately in the browsers) and meta tags (enables
search engines to spider your pages).
wrapper: is the div that wraps around all the other divs
like a container for the page elements.
header: defines the top banner of the page
main: defines the main content of the page
nav: defines the navigation of the page
footer: defines the footer and sub-navigation of the page
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
How to Build a Basic CSS LayoutLayout" />
charsetiso-8859-1">