Anyone who isn't a web developer or at least interested in that type of stuff - this thread ain't for you
Anyone who's done web development for more than a few days knows that all browsers are not made equal. I'm not even talking about quality necessarily, but just in terms of the way they handle both the (X)HTML and CSS specs.
Historically, (good) web developers have done their best to write standards-compliant code and dealt with specific browser issues using either IE conditional comments, or CSS selector hacks. There are other ways of doing it, but these seem like the 2 most common.
Using separate files served either with IE conditional comments, or server-side with IF statements is headache to maintain, because if you ever need to make adjustments you have 1x{number of CSS files} places to make that change. And if you've done a decent job with your code, you'll rarely need more than a few lines worth of adjustments. Is that really worth the extra server hit?
CSS Selector hacks are tad less elegant, but offer a bit more flexibility. You can do some slick stuff with these, but I personally don't like them for 2 main reasons:
- They're ugly, and not all of them are actually standards compliant, and
- If for whatever reason the browser vendor decides to plug that selector bug, all your changes are rendered moot on the next update. Of course, if the browser vendor decides to fix whatever issue that required the hack in the first place, any type of CSS workaround would be broken.
So anyway, that's the history and the 2 most common solutions to the problem. I'd like to preface this with the fact that I can in no way claim that the idea in this post was first created by me. I'm not that smart, nor am I that egotistical :) However, I can say that in my experience, I haven't seen anyone using this
exact method, which is what prompted me to post about it.
The entire idea is this:
Pretty simple right? And fully standards compliant!
If you want to see this in action, as I'm sure I didn't explain this correctly (I have that problem), I've set up a VERY basic demonstration of the concept here:
http://dancunha.com/css_targets.phpI'd definitely appreciate any feedback or improvements you may have on it, especially if you see any major pitfalls in doing it this way. I'm just so sick of the conditionals or the ugly browser hacks. I'd like to apply this technique on future projects, if possible. The CSS code is just so much cleaner.
And let me know if you use this method, I'd love to hear about it!