5 {{ upvoteCount | shortNum }}
5 {{ upvoteCount | shortNum }}

Are you sick of hacking away at CSS to make it browser compatible?

by GreatWebSuccess
4 replies
  • WEB DESIGN
    • |
Hey everyone,

This is an old script that was born back in July of 2006, and it's one that I've been using since then. Instead of hacking away at CSS for different browsers, especially all versions of IE, you can use this simple method of making it work and it validates through W3C. I've spoken to a lot of web designers and to my astonishment, about 90% of them don't know about this script.

The method works by inserting a javascript file into the <head> section of your website and then using a special attribute in CSS to make it browser and OS specific.

For example if you have an ID that needs some padding-below in IE7/8 only, since it looks fine across FireFox, Chrome, Safari & Opera, you can do something like this:

win.ie #id {padding-below: 20px}

Anyway, check it out by clicking CSS Browser Selector
#browser #compatible #css #hacking #make #sick
  • Profile picture of the author n7 Studios
    And for those who don't have Javascript enabled?

    You would be much better off using a CSS reset stylesheet, which attempts to start you off with a pretty equal footing across all browsers. Also having an in depth knowledge of CSS, and it's specific quirks with specific browsers can help you to avoid common issues.

    Take a read of CSS Tools: Reset CSS for more information.
    Signature
    THE Web Development Guru - Bespoke WordPress Theme, Plugin + iPhone Apps [HTML5, CSS3, PHP, MySQL].
    {{ DiscussionBoard.errors[1497127].message }}
  • Profile picture of the author GreatWebSuccess
    n7,

    I do use a CSS reset stylesheet as well, but sometimes there is just one or two issues that you come across that you can't resolve.

    Most browsers and computers have JavaScript enabled, and the amount of those is relatively low -probably less than the amount of users still using IE6 which is dwindling as the months go by.

    I can certainly understand your point though and there are many valid reasons why one should disable javascript but we don't have to get into that right now. This was simply another tool to do something that many people hack away at.
    {{ DiscussionBoard.errors[1498042].message }}
  • Profile picture of the author wayfarer
    The amount of users with JavaScript disabled is estimated to be around 5%. This is high enough that you shouldn't count on JavaScript being enabled, though I think it is ok to use hacks like this to target old browsers, like IE6. Almost all IE6 users have JS enabled since they usually aren't very technical users who don't know of any reasons to disabled it, in addition to the fact that IE6 is a shrinking minority of users, though it hasn't disappeared yet.

    Then again, it all depends on your users. If you're building a web-application which requires your users to have JavaScript enabled, and you notify them of this requirement any time it is found to be disabled, using JS hacks is not as much of an issue.

    That said, there are already CSS only methods to select IE7 and IE6 for specific rules, which are the only two browsers that usually need correction. Plus, using conditional comments is easy.
    Signature
    I build web things, server things. I help build the startup Veenome. | Remote Programming Jobs
    {{ DiscussionBoard.errors[1498174].message }}
    • Profile picture of the author Karen Blundell
      IE6 - web designers' bane!
      oh the horror!
      Signature
      ---------------
      {{ DiscussionBoard.errors[1500351].message }}

Trending Topics