Topic: Rails methods to conditionally load CSS?

Are there any Rails methods that will allow me to load stylesheets based on the browser detected?  Or should I just download one of the many javascripts that exist?

Another quick question... Do you guys use multiple stylesheets for different browsers?  Or do you just fine tune one?  I have minor layout issues with firefox vs. Opera and have horrid ie6 problems.  I imagine having a stylesheet for each browser could become maintenance hell.  Just wondering what you guys are doing.


Re: Rails methods to conditionally load CSS?


I'm not sure the answer to the first part of your question, but here's some info on the latter.

I always just use one style sheet for my projects and then insert different "hacks" as they're called to help fix browser-specific issues.

Here's some info on css browser hacks: … tion.shtml

Though, there are some people (see: -- #5) who argue to just maintain your site for one superior browser and let all inferior browsers suffer.

Hope this helps. If you have specific questions about any hacks, just let me know.


Re: Rails methods to conditionally load CSS?

Thanks Matt.  I read through the link you sent.  I have a feeling that those are only a very small portion of the hacks that one would need to know.  I'm trying to get my lcol and mcol to line up properly and it's just been a nightmare.  Opera and Firefox are only one pixel off, but IE just goes crazy.  Problem with IE is that the left margin (of mcol) is correct, but the right margin does not stop within the container div and wants to expand accross the page.  As a result mcol pushes itself below lcol. 

Anyway, I think for my site it's going to be easier to maintian a few stylesheets rather than kill myself with hacks.  I just need to have a good system so I don't create a mess for myself.  I use primarily use opera so that's has to work, and so does firefox.  Not sure about konqueror or safari yet.  I'm definitely going to ignore IE5, but I probably should address IE6.

One other question to add... I really don't like using this as my CSS path: href="../../stylesheets/default.css".  Does rails have a better way of submitting stylesheets so I just type the name of the stylesheet?  If not do you guys create symlinks to the sytlesheets directory or just do it like i'm doing?

Re: Rails methods to conditionally load CSS?

Yah, I mainly use hacks for IE -- Firefox and Opera seem to work well together.  Forget IE5. As far as I know, there still are no Safari or IE7 hacks.

If you're in the views folder, you can simply use:

[code ruby]
<%= stylesheet_link_tag "sheet1", "sheet2" :media => "all" %>

Then, just have your stylesheets in: public\stylesheets



Re: Rails methods to conditionally load CSS?

Thaks Matt, worked perfectly (actually, you need a comma after "sheet2").

Thanks again,

Re: Rails methods to conditionally load CSS?

sorry about that! glad it worked!


Re: Rails methods to conditionally load CSS?

I just thought I'd post what I ultimately ended up doing to solve the issue of cross browser support.  I created a forwarder page at my site's docroot.  In that forwarder I put in javascript that warns the user if they have an unsupported browser, but still allows them to access the site.  Had I put that code in my site layout it would execute on every page refresh so it's much more appropriate to go on a non-rails page who's only purpose is to greet the user. 

My layout has a javascript that silently detects the browser and loads the appropriate stylesheet.  At the moment I have default, opera and ie6 stylesheets. I had to revert back to using the "../../stylesheets/" path because I don't know how to use RJS yet. 

Anyway, it's not as clean as I'd like but it works.

Last edited by BIGtrouble77 (2007-02-25 19:55:56)