controller/action specific CSS

Here’s a trick that I use to put styles on specific pages, or even better on all the pages in a specific controller—with no extra markup needed!

I call them “controller specific” CSS rules.

In the layout template, I give the body tag a name that is based on the controller attributes:
<body id="<%= "#{controller.controller_name}-#{controller.action_name} %>">
Now in the CSS I can give rule to any of the registration pages pages (for instance relating to register_controller.rb):
body[id|=register] { width: auto; }
You can also give a rule to a specific page
body[id|=register-step_1] { width: auto; }

For more info, see W3C CSS 2.1 Spec 5.8.1

Sorry, comments are closed for this article.