If you’re really passionate about designing great websites, browser specific CSS is a necessary evil. We all wish it wasn’t needed, but thanks to web browsers that suck ass cough IE cough, we need an effective way to alter our CSS styles based on browsers.
There are lots of different solutions for how to implement browser specific CSS. Options range from javascript or conditional comments to server side solutions. The Ruby on Rails CSS Browser Selector plugin is by far
the best solution I’ve used. It is a very simple plugin that
automatically adds some extra CSS classes to your html so that you’re
able to apply extra styling based on browser (or operating system).
It’s drop dead easy to integrate into your project, and allows you to
keep your browser specific hacks in context with the rest of your styling.
example rendered html source:
hello world ===========
example css for browser specific styles:
span.date {
color: blue;
}
body.ie6 span.date {
padding: 2px;
}
If you want to make these browser specific hacks even more managable, take a look at SASS:
span.date
:color blue
body.ie6 &
:padding 2px
I have not seen server side solution like this for the Java world, but maybe one of those wicked Wicket developers can whip something up! =)
That’s enough backstory on this awesome plugin. The real point of this post was to announce that I have forked the CSS Browser Selector plugin
to run on Rails 2.2 with no deprecation warnings. Super small change,
but it should make your life a bit better by removing the annoying
deprecation warnings. Check it out on github.
Oh, and my personal favorite browser specific CSS trick is this:
body.ie6 {
display: none;
}