Rails, Javascript, and CSS

I've searched the histories and don't see a relevant discussion. I'm
sure it's there, but I haven't found it.

I want to adjust the stylesheet loaded according to the user's screen
resolution. I know there are browsers that don't report it (or not
accurately), but that's what defaults are for. With the hard core gurus
here, I'm sure some of you are doing that right now. I know (believe?)
that this is going to require javascript. I've never had to marry
javascript and rails code, so I'm not sure of the best way to approach
this. Obviously, I want it to execute as the page is loading. Do I put
this in the head section where it would normally be? Any and all hints
you can give me will be greatly appreciated.

As always, thanks in advance
---Michael

Michael Satterwhite wrote in post #972068:

I've searched the histories and don't see a relevant discussion. I'm
sure it's there, but I haven't found it.

I want to adjust the stylesheet loaded according to the user's screen
resolution.

No you don't. Really, you don't. You want to design a stylesheet that
looks good at any resolution. This is how HTML and CSS were meant to
work. If you're doing resolution-dependent design, you've already
failed -- the Web is not print.

This question really has nothing to do with Rails, and should be taken
to a CSS list, but if you can explain why you think you need different
CSS for different resolutions, I'll try to provide alternative
approaches.

Best,

I've searched the histories and don't see a relevant discussion. I'm
sure it's there, but I haven't found it.

I want to adjust the stylesheet loaded according to the user's screen
resolution. I know there are browsers that don't report it (or not
accurately), but that's what defaults are for. With the hard core gurus
here, I'm sure some of you are doing that right now. I know (believe?)
that this is going to require javascript. I've never had to marry
javascript and rails code, so I'm not sure of the best way to approach
this. Obviously, I want it to execute as the page is loading. Do I put
this in the head section where it would normally be? Any and all hints
you can give me will be greatly appreciated.

You don't have to use javascript - you can use media queries (http://
www.w3.org/TR/css3-mediaqueries/#device-width) to do things like have
a stylesheet that applies only to screens of a certain size or bigger.
I'm not sure how those interact with the varying screen densities
around (eg even though an iphone 4's screen is twice as wide and twice
as high as previous models, you'd probably want similar layout).