CSS / 3 columns / header / footer

no javascript, no table, no image

A few validating hacks for MSIE and Mozilla.

Compatibility is sometimes difficult to achieve.
Once a DOCTYPE has been chosen, margins and paddings have been set, Mozilla and Opera usually have quite the same rendering of CSS rules.
Thus we have to hide or set some rules for Internet Explorers users.

Hiding

If you want to hide a rule such as :first-letter from MSIE 5.x and 6, you can use:

html>body p:first-letter,html>body div:first-letter{
font-weight:bold;
}

If you want to hide a rule such as height:1%; from Mozilla, Opera and Internet Explorer , you can use:

* html #menubas{
height:1%;
}

If you want to hide a rule such as height:1%; from IE/Mac but apply it to IE/Win to set hasLayout, you can use:

/* start IE_Mac hide\*/
* html #menubas{
height:1%;
}
/* end IE_Mac hide*/
#menubas{
min-height:1%;/*for IE 7*/
}

Setting

If you want to set different values to margin to IE/Win 5, 5.5 and 6 (in "Standard Compliance Mode" thanks to the DOCTYPE), you can use:

#zone_top dl{
margin:-.1em 0 0; /*all but MSIE/Win*/
}
/* start IE_Mac hide\*/
* html #zone_top dl{
margin:-.5em 0 -.4em 0;/*value for MSIE 5*/
}
* html #zone_top dl/**/{
margin/**/:-.4em 0 0; /*value for MSIE 5.5*/
margin:/**/-.2em 0 0; /*value for MSIE 6*/
}
/* end IE_Mac hide*/

These filters exploiting MSIE comments bugs or the lack of support of html> will fix most of the display problems if you use "Standard Compliance Mode".

MSIE 7 brings surprises as it supports html > body, body > element, head:first-child + body and stops interpreting the "star hack" (* html) in "Standard Compliance Mode".
Using conditional comments for the differents versions of MSIE will sometimes become the wisest solution.

visits: 284578
at 1:35:20 utc+2 on Sat Apr 19, 2014

W3C XHTML 1.0
W3C CSS