0

It doesn't take long to realise when using css that certain things are not cross-browser friendly.

For example, when I wanted a semi-transparent png I had to give IE something ridiculous like:
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...);

I've had problems with positioning and pseudo-selectors etc. as anyone who has played around with css for more than 20 minutes will have encountered.

  • To solve problems sometimes I start out deciding that I will only do what all the browsers support and support in the same (or at least a fairly similar) way.
  • Other times I just chuck in conditional comments and give IE it's own stylesheet.
  • And then on other occasions I simply use css hacks to exclude certain browsers from reading particular bits (like the old "* html {}" or "html>/**/body {}")

So my question is, which is the best option. The first is pretty limiting and you end up developing for what IE6 is capable of doing but the other two feel a bit mucky. So which is the bets in terms of programming practices, rendering efficiency etc.?

TylerH
  • 20,799
  • 66
  • 75
  • 101
jcuenod
  • 55,835
  • 14
  • 65
  • 102
  • I suggest you adopt the same policy as the company I work for and only support each browser in it's current version and current version - 1. That means IE7/8 and soon to be IE8/9. – sberry Jan 20 '11 at 07:02
  • Not practical when the web still has so many IE6 users. - Although extremely tempting... – jcuenod Jan 20 '11 at 07:05

2 Answers2

1

I always prefer conditional comments with IE fixes. The hacks are not consistent with IE fixing the parsing so the hack doesn't work anymore but then not fixing the thing the hack was compensating. Also, they could mess with other CSS parsers.

scragz
  • 6,670
  • 2
  • 23
  • 23
1

Short answer:

  • Do your best to adhere to standards
  • Be creative
  • Stop using hacks and start using conditional comments

In the long run, CSS hacks are just going to pollute your stylesheets and make them more difficult to maintain. Avoid them wherever you can, and use conditional comments with IE-specific stylesheets instead (since most hacks cater to IE). I can guarantee that CCs are much less mucky than hacks, if mucky at all.

You do not have to be limited by IE all the time. There's a concept called progressive enhancement, which means you can make your pages look slightly prettier in modern browsers that support advanced styling, and so on. There's nothing wrong with using CSS3 properties like border-radius today, since browser vendors are working (relatively) quickly to bring support for these to their products.

But then there are clients, which would be a different topic of discussion. I would say, though, strike a balance: educate your clients and be creative, but don't try to do anything too smart or fancy. And please, just avoid CSS hacks unless it's half past 4 in the morning and you're downing can after can of beer and just want to get something done in whatever circumstance.

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
  • You down "can after can of beer" to code? I may have onpy recently turned 21 but that seems unhealthy/illegal/likel to get you fired. – Chris Lutz Jan 20 '11 at 07:25
  • @Chris Lutz: Can't speak for unhealthy/illegal (I don't drink), but there are the people who work from home. That expression was completely tongue-in-cheek anyway :P – BoltClock Jan 20 '11 at 07:39
  • Mine was also a humerous comment. I need to start using smileys. Also, I need to start using more discipline spell-checking when typing on my phone. I'm normally a lot better at spelling and typing than that comment indicates. :P – Chris Lutz Jan 20 '11 at 07:42