Web Development

Web Development Tips & Tricks, the things that you don’t want to figure out.





«
»

Browser-Specific CSS

If you’ve done much with CSS at all you know that the IE’s not only display differently than Firefox, but IE7 displays differently than IE6.

Instead of using Javascript or another scripting language to determine what browser is being used, there are a few simple techniques that can handle that problem for you. This works inline or through an included stylesheet.

CSS

h1 {
font-size: 20px;
#font-size: 22px;
_font-size: 10px;
}

The first applies to all browsers, Firefox, IE7 & IE 6. The second applies to IE7 & IE6. The last applies to only IE6. This means that if you define them in the order I have given you, the top only effects Firefox, while the second line only affects IE7 and the last line only affects IE6.-Kerry

Share and Enjoy:
  • email
  • Digg
  • StumbleUpon
  • del.icio.us
  • Facebook
  • Technorati
  • Google Bookmarks
  • Furl
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

This entry was posted on Saturday, January 26th, 2008 at 4:17 pm and is filed under CSS. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

  1. phoenixdev posted the following on February 25, 2008 at 4:02 pm.

    No, as I rarely have a case where I need to check the other websites, and they usually go identically to one of the main 3.

    I’m sure there are solutions and if you look on Google you’ll be able to find them, there are Javascript solutions and so on, to create browser-specific CSS for all browsers, just probably going to be more complicated.

    -Kerry

  2. Flood posted the following on February 25, 2008 at 3:58 pm.

    That’s interesting, do you have a solution for other browsers (opera) or Firefox on Mac?

Leave a reply