CSS Best Practice

Soldato
Joined
25 Mar 2004
Posts
15,912
Location
Fareham
Hi,

I run a website at work for internal use that is pretty simple really, it's running ASP.NET C#. Currently I am using a single style sheet for styling my elements.

One of the problems I've had is that sometimes I get a bit lost on how best to approach styling my page content, and often wind up having different classes for specific things that could probably be better served by being cleverer with how I define my page elements and subsequently deciding how they should look. I then wind up getting a bit "lost" in my CSS as there is probably way too much CSS considering most of my content is standardised.

Most of my pages are either full page width contents, as I'm generally just displaying data, allowing users to filter the data. Occasionally I split my page down the middle and have a "left side" and a "right side". Often when doing such things I find myself having a separate class in my CSS for .LeftSide and .RightSide, and then of course I have to define things such as .LeftSide h1, and .LeftSide p for my <divs> and subsequent HTML elements.

I would like to re-approach how I've done the CSS and almost start over, but using more sensible CSS that makes updates easier. Can anyone suggest the best approach to this? what works well for you?

At a guess I should really define my basic styling for all heading elements, all page backgrounds, all paragraph fonts/spacing etc, and then when I want an element to look different give it a different class?
 
Hmm not sure that's entirely what I'm after, I guess I'm more interested in how people go about structuring their CSS and making it easy to update, and apply to the elements of the page without creating classes and id's all over the place!
 
Thanks for all the replies guys, been busy last week but got around to putting some time into this. I think some of the recommendations here are a little overkill for my little project/site, but I have fine tuned the CSS and tried to do better with assigning styles to my pages and elements.

So far I've managed to bring my .css file down from 1464 lines, to 592 :)
 
Back
Top Bottom