# Dynamic CSS Generation **URL:** \ **Category:** Rails\ **Created:** [October 10, 2007, 1:31am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818 "2007-10-10T01:31:38Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 1:31am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/1 "2007-10-10T01:31:38Z")
Anyone dynamically generating CSS based on browser-type out there? I’ve currently hacked my application in the most disgusting of ways to pull off what I need to support my project - but I’m just not pleased with the implementation. That said - it would seem a very poor idea to actually dynamically generate CSS - probably best to create static files per browser (let’s say two if you needed to support two browsers) and return the appropriate css based on user agent? Would it be possible to put this behind an action that read something like… def get\_style if request.user\_agent.includes(“some\_cryptic\_ie\_string”) render :template =\> “path/to/css” end end Any assistance? TIA! ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 2:10am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/2 "2007-10-10T02:10:02Z")
Hi Cory, I would put the style name to an instance variable. def define\_style if request.user\_agent.includes(“some\_cryptic\_ie\_string”) @style = “style1” else @style = “style2” end end In your view (most likely in your layout), add following line. You need to put style1.css and style2.css in public/css. \<%= stylesheet\_link\_tag @style %\> Also, do not forget to add before filter. class YourController \< ApplicationController before\_filter :define\_style This way, define\_style is called every time the controller is processed. Cheers, Glen On Oct 9, 1:31 pm, Cory W. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 2:17am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/3 "2007-10-10T02:17:34Z")
Cory W. wrote: > Anyone dynamically generating CSS based on browser-type out there? I’ve How would you know the browser type? The request-header? Javascript? How about these tricks: * * * ## How to target IE6 with a CSS rule Prepend the property name with an underscore. Example div.red { \_margin-left: 50px; } ## Then a will have margin-left: 50px applied but only in IE6. ## How to target IE7 with a CSS rule 1. Add a class to the body element. It can be chosen arbitrarily; it is only important that the body-element has a class: 1. Add rules like this. body[className] div.red { margin-left: 50px } Then a will have margin-left: 50px applied but only in IE7. Reference: [http://pnomolos.com/article/6/a-valid-css-hack-to-target-only-ie7](http://pnomolos.com/article/6/a-valid-css-hack-to-target-only-ie7) Stephan ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 2:19am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/4 "2007-10-10T02:19:26Z")
If it’s mostly IE you’re having problems with, have a look at IE’s ‘conditional comments’. You can specify code you only want to be visible to IE, or specific versions of IE. This means you can write your CSS for the more standards compliant browsers, and include IE hacks in one file like so: See [CSS - Conditional comments](http://www.quirksmode.org/css/condcom.html) Joel. On Oct 10, 9:31 am, Cory W. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 11:19am UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/5 "2007-10-10T11:19:10Z")
> was just going to post the above 🙂 … passed just around the corner! you can do this as well: the lt (\<) / gt(\>) operators on IE 7 IE 6 -\> for any browser that is less than / greater than IE 6 / IE & etc ) i would stick to css hacks and if IE comments rather than mix this heavily into the app, but whatever suits u 😛 enjoy ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 5:28pm UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/6 "2007-10-10T17:28:13Z")
Thanks all! Conditional comments it is! ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 3:40pm UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/7 "2007-10-10T15:40:50Z")
Not exactly what you asked but I thought I’d mention, I use this for dynamic css and love it. [http://www.misuse.org/science/2006/09/26/dynamic-css-in-ruby-on-rails?story=20060926084103529](http://www.misuse.org/science/2006/09/26/dynamic-css-in-ruby-on-rails?story=20060926084103529) Basically you create a controller (rcss\_controller) and your css file(s) are just templates which can now contain ruby code, instance variables, etc. linoj On Oct 9, 7:31 pm, Cory W. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) ---
**Author:** ![corywilkerson](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/c/aca169/32.png) [@corywilkerson](https://www.ruby-forum.com/u/corywilkerson)\ **Post date:** [October 10, 2007, 5:43pm UTC](https://www.ruby-forum.com/t/dynamic-css-generation/116818/8 "2007-10-10T17:43:07Z")
Another good reason to use conditional comments is that you aren’t preventing yourself from ever being able to use page caching… Then the html output is the same regardless of the UA. Of course this doesn’t matter if your pages are all user-specific anyway, but some of the cms stuff I’ve built does very well with page caching since everyone sees the same page. Matt On 10/10/07, Cory W. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid) wrote: > ## Thanks all! Conditional comments it is! > > Posted via [http://www.ruby-forum.com/](http://www.ruby-forum.com/). > > > ## – Matt W. Thermal Creative [http://blog.thermalcreative.com](http://blog.thermalcreative.com)