You've got a lot of Gal

Yet another blog about Ruby, Rails, Javascript, Apple, Malteses and Shih-Tzus by Gal Steinitz

This site is completely static. It was last generated with Octopress and Jekyll on Sep 02, 2013 and hosted on github pages.

Cleaner CSS Browser Targetting With Simple-useragent Gem

I just posted the “simple-useragent” gem, which provides the ability to for cleaner browser specific CSS targeting*. This is for rails projects but the concept can work anywhere. For example, instead of the targeting IE7 with your CSS with [sourcecode language=”css”] /* IE7 */ *:first-child+html #content { height: 500px; } [/sourcecode] You can now do this: [sourcecode language=”css”] .ie7 #content { height: 500px; } [/sourcecode] To take advantage of this, you just need to add the following to your body tag: [sourcecode language=”ruby” htmlscript=”true”] <body class=’<%=UserAgent::browser(request)%>’> [/sourcecode] * Admittedly targeting CSS to a specific browser is a bad practice that should generally be avoided. For more details about why browser detection in general is a bad idea, see However sometimes there is no choice - especially under time constraints.
Additionally, simple-useragent makes the following methods available to you: [sourcecode language=”ruby” htmlscript=”true”] UserAgent::is_desktop? UserAgent::is_mobile? UserAgent::is_blackberry? UserAgent::is_iphone? [/sourcecode] The is_mobile? and is_desktop? methods are using a minimalistic approach, converted from the python script here: The theory is that since there are a lot more mobile user agents than there are desktop user agents (hundreds or even thousands) - we detect the known list of desktop user agents, and if its not one of those we assume that it is mobile. It works surprisingly well in the vast majority of cases. So far I’ve only seen it fail with spoofed or malformed user agents. To install: [sourcecode language=”bash”]gem install simple-useragent[/sourcecode] The gem is hosted on gemcutter - if you don’t have gemcutter as a source you’ll have to add it [sourcecode language=”bash”]gem install gemcutter gem tumble [/sourcecode]
source at Update: Thanks to an anonymous commenter on rubyflow for pointing out a jQuery version of this: jquery.platformselector.