Header Content Here

Three Column Pixel Perfect with Header & Footer - MK 1

Ver 2.3

I have intended this to be my most complete page template.

The left and right columns are positioned absolutly, as in previous template examples. But now we have a header and footer. One problem we first have to overcome is that it's impossible to get the left and right columns to always match the height of the content column. If the L&R columns are too short we see the page background and quite simply it looks awful. If the L&R columns are too long they overlap the page footer.

To overcome the first problem we enclose the main content div in an outer div. This unfortunatly has to be the same colour as the L&R columns which must be the same colour as each other.

The overlap? All I think we can do is to stack the footer higher than the L&R columns and risk losing content. :(

One good thing about this method is that we can set the margins of the center content div much larger than the width of the left and right columns and therefore should not need to worry about IE5x PC's stupidity. And it still gives the appearance of being pixel perfect.

Note also, no need for the box hack as we have built some flexibility into the template!! IMO. Does this hold true in your browser? Please let me know.

Also, one potential problem. If you set position:relative for the #c-block it completely hides the left and right columns. So just leave it out? In IE6 yes or else nest ALL the blocks within this div, including the header div.


This template has been tested in:

Changes in this version:

  1. Defined zero for the body to fix a problem in Opera.
  2. specified padding for h3 which was the title in the content div, this forces the top of the div up to where it should be (it seems to collapse??)

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.


Footer Div - Copyright Information

Left Column

The left col can be used for navigation links, search box etc.



View more templates.


Right Column

More links?
Advertisements?