• Articles and Tutorials
• Contact

Separate styles for IE and firefox

I saw something funny in my google analytics account yesterday, I think it funny to look at all whats happening with my visitors on my site, where they come from, what they read on my site, the demography etc.

Now something strange happened, usually most of my visitors (like 70 percent) of my visitors uses Internet explorer as their preferred internet browser, but I saw now it has changes, the last couple of weeks there has been a high increase of visitors using firefox, now that about 70 percent.

That made me thinking does everything work exactly the same in both firefox and IE, and no of cause not. until now I have just accepted that some things might not work as well in firefox, but that doesnt matter, because most people uses internet explorer.

But now I have to rethink it all to make stuff compatible with firefox as well as IE.

So I found a small "hack" so you can configure / style different properties in css. Simple said, this hack makes it possible to create separate settings/styles for firefox, IE 6 and IE 7.

So lets say you have problems with compatibilities for a width of a div container.

See the example below.

This means the first width style will be compatible with all browsers, then # will be ignored by firefox, and IE 7 wont work with the _width property.

This is just great, a neat little trick to separate css styles for firefox and IE.

Only problem I havent tested yet though is the new IE 8 BETA (as it is right now) how does that work? I will make an update when I know more or you can write it in the comment section if you know anything about it.