# Structuring CSS and naming conventions

**URL:** <https://www.ruby-forum.com/t/structuring-css-and-naming-conventions/115402>\
**Category:** Rails\
**Created:** [September 24, 2007, 10:42pm UTC](https://www.ruby-forum.com/t/structuring-css-and-naming-conventions/115402 "2007-09-24T22:42:31Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tonypm](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/a587f6/32.png) [@tonypm](https://www.ruby-forum.com/u/tonypm)\
**Post date:** [September 24, 2007, 10:42pm UTC](https://www.ruby-forum.com/t/structuring-css-and-naming-conventions/115402/1 "2007-09-24T22:42:31Z")

</div>

Hi,

I would be really interested if there is any convention or strategy to  
help with CSS in Rails.

Currently my styles are in a couple of fairly large stylesheets and I  
use the single application layout throughout. (I like a consistent  
pages for my whole app)

However, I find naming styles a constant struggle. The stylesheet has  
become unwieldy and I struggle to avoid name conflicts. (I find this  
with CSS generally anyway)

I am thinking that I should start to have different stylesheets for  
different areas of the app and one for common functions, then the  
different stylesheets need to be loaded. What is the best way. I am  
reluctant to use different layouts because that would not be DRY. I  
could use content for to pick up the different stylesheets, but that  
seems a bit messy.

also what about performance, if I keep changing stylesheets, would  
they still be cached by the browser (Firefox in my case).

Finally what about naming convention. I am rapidly coming to the  
conclusion, that the best approach is to have a main div for each page  
with an id of the controller-action. Then id’s in that div could be  
simple and need not clash as long as I always target my rules using  
div#name-controller div#something etc { css rules }

This starts to feel a bit more structured like the rails app. But am  
I over doing it? It seems to me there must be a generally “best” or  
pragmatic or agile way to do css stuff. I just cant see it. So maybe  
those of you who have been doing this for large apps could give some  
pointers.

Thanks  
tonypm
