HTML, CSS, Tutorials

CSS for different versions of IE

Some times your site looks different in IE 6 then it does in 7 or in Firefox. Most of the time you can combat this with better coding but there's times when that just not enough.

in them situations you can use condition statements for IE6 & IE7 in these conditions you would ran an alternate version of your CSS code an example of this:

<!--[if lte IE 6]>
<style type="text/css" media="all">
#box {
  padding-top:50px;
  text-align:center;
  color:#FFFFFF;
  font-weight:bold;
}
</style>
<![endif]-->

<!--[if lte IE 7]>
<style type="text/css" media="all">
#box {
  padding-top:50px;
  text-align:center;
  color:#FFFFFF;
  font-weight:bold;
</style>
<![endif]-->

This would be placed in between the head tags

if lte IE 6 means if the browser is IE 6 then run the following code and the same applies to if lte IE 7

you can either put some simple style changes in the if statement like this

<style type="text/css" media="all">
#box {
  padding-top:50px;
  text-align:center;
  color:#FFFFFF;
  font-weight:bold;
</style>

or import another stylesheet which is a better approach as your source code looks cleaner. Like this :

<style type="text/css">
<!--
@import url("style/ie6.css");
-->
</style>

any CSS style called inside the if statements take precedence over the main stylesheet and take effect instead of what's in the main stylesheet for that element.

Hopefully this will help you get around some of the problems you have with different versions of IE.

David Carr

David Carr

For the past 12 years, I’ve been developing applications for the web using mostly PHP. I do this for a living and love what I do as every day there is something new and exciting to learn.

In my spare time, the web development community is a big part of my life. Whether managing online programming groups and blogs or attending a conference, I find keeping involved helps me stay up to date. This is also my chance to give back to the community that helped me get started, a place I am proud to be apart of.

Besides programming I love spending time with friends and family and can often be found together going out catching the latest movie, staying in playing games on the sofa or planning a trip to someplace I’ve never been before.