I'm also from a programming background. Lately I've been working to try
to take advantage of the inheritance in CSS. So, I start with a base.css
(or global.css) and as the CSS grows, I break out portions specific to a
portion of the interface out into seperate files. 

For instance, start with global.css. Then I find there are styles
specific to the 'admin' section of a site, I make an admin.css. If form
styles are common, I make a forms.css and then import this back into
global and admin.css. I usually try to not pull portions of CSS out into
a separate file until there are enough rules to make it worthwhile.

I organize like this in an effort to reduce redundancy and make it
easier to find rules. One of my core development values is that I would
rather go one place to fix something. Although I am finding this
challenging with CSS because of the inheritance...but the organization
does help a lot when drilling down on a specific element. 

I also figure if I have to go back to it later, I'll find it easier to
reverse engineer.

I usually start with the container element and work inward (ie. div ->
down to paragraphs or something) but I like the idea suggested here to
alphabetize so I'm trying it out. It is a lot easier to find a rule when
it's organized this way...thanks for the idea!

diona



On Fri, 2005-04-08 at 08:56 +1000, Earle Castledine wrote:
> Im also interested in this.... As I'm a programmer I had started laying out 
> my css like code, so that id have:
> 
> #nav{}
> ....#nav p{}
> ....#nav ul{}
> ........#nav ul li{}
> 
> Which to me made sense and was nice and clear. But the problem was that 
> things are not related 1 to 1... the #nav ul li{} may need to be styled in 
> multiple places. Then it all fell to pieces :)
> 
> 
> 
> -----Original Message-----
> From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]
> Behalf Of C Slack
> Sent: Thursday, 7 April 2005 7:34 PM
> To: wsg@webstandardsgroup.org
> Subject: [WSG] CSS Document layout/structure
> 
> 
> Hi,
> I am struggling to get to grips with designing with web standards and 
> one of the problems I am having is with "reading" style sheets.
> Having sorted out the html code to make it more readable and modifiable 
> it seems that we have shifted the "mess" to style sheets. Many of the 
> sheets I look at are long, comment-less and very difficult to understand.
> So that I don't fall into the same trap, can anyone recommend some 
> reading on how to make style sheet structure and layout both 
> understandable and also easily modified?
> Thanks,
> 
> Charlie
> 

******************************************************
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
******************************************************

Reply via email to