Wednesday 10th of March 2010 11:46:55 AM

Two Column Flexible

Ver 2.3

This is a very easy page layout which you have probably seen on sites such as ALA (A List Apart). Each column is created with simply two div tags.

The left column uses float left and has a percentage width allowing both columns to 'flow' as the browser window changes shape.

This template has been tested in:

Changes in this version:

    colorreproduction is, as it happens, a major issue unto itself. Aswe'll soon see, all colors can be specified in a consistentmanner, which would seem to solve the issue of whether two differentuser agents will display the same color. In fact, the situation ismuch more complicated. In the first place, human perception isrelative. The same color displayed on the same monitor may appear tochange due to changes in lighting, ambient brightness, adjacentcolors, and many other factors. You can experiment with this effectsimply by changing the background color of your computer's
  1. Defined zero padding for the body to fix a problem in Opera.

Filler Content

Dáig alta in mac sin i tig a athar & a mathar icon airdig i m-Maig Muirthemne, ocus adfeta dó scéla na maccaemi i n-Emain. Dáig is amlaid domeill Conchobar in rigi, o ro gab rígi in rí, .i. mar atraig fóchetóir césta & cangni in choicid d'ordugud. In lá do raind i trí asa athlil: cetna trian de fóchetóir ic fegad na maccaem ic imbirt chless cluchi & immanae, in trian tanaise dond ló ic imbirt brandub & fidchell, & in trian dedenach ic tochathim bíd & lenna, con-dageib cotlud for cách, aes cíuil & airfitid dia thalgud fri sodain. Ciataim ane ar longais riam reme dabiur bréthir, ar Fergus, na fuil in hErind no i n-Albain óclach macsamla Conchobair.

Ocus adfeta don mac sin scéla na maceáem & na maccraide i n-Emain, & radis in mac bec ria mathair ar co n-digsed dá chluchi do chluchemaig na Emna. Romoch duitsiu sain a meic bic, ar a mathair, co n-deoch anruth do anrothaib. Ulad lett no choimthecht ecin do chaimthechtaib Conchobair, do chor th' aesma & t'imdegla for in maccraid. Cían lim-sa di sodain a mathair, ar in mac bec, & ni biu-sa oca idnaide acht tecoisc-siu dam-sa cia airm itá Emain. Is cían uait, ar a mathair, airm in-das-fil. Sliab Fúait etrut & Emain. Dobér-sa ardmes furri amne, ar esium.




The right column can be used for
navigation links, search box etc.



View more templates.

subsequent CSS, and either will have the result depicted in Figure 6-3:

<BODY TEXT="black" LINK="#808080" ALINK="silver" VLINK="#333333">
BODY {color: black;}     /* replacement CSS */
A:link {color: #808080;}
A:active {color: silver;}
A:visited {color: #333333;}
Figure 6-3

Figure 6-3. Replacing BODY attributes with CSS

While this may seem like a lot of extra typing, consider that using the old method of BODY attributes, you could only