Regenerate stylesheet with all styles listed alphabetically?

[snakehips2000]

I'm a newbie to CSS and, having read the various preferences which some people have for grouping their styles, was wondering if there is a CSS editor which will automatically re-create a stylesheet containing styles in no particular order and simply re-list them alphabetically. I currently work with Dreamweaver MX 2004 and the styles panel lists the styles as it sees them in the stylesheet.

I find I'm having to do a lot of scrolling up and down trying to find the style I need to edit.

Thanks.

 

[JillC]

The order is important. That's the whole idea behind "cascading" style sheets. You'd better go back to the first tutorial and re-read that section.

If you give your styles sensible names (related to what they do like navbar or menu or maincontent) it will not be such a problem to find the right ones.

 

[Tarwn]

Commenting helps also. I generally make sure I have sections in my CSS sheets to make sure it's even easier to find things. For instance, if I have the same page layout across my whole site, I might move the basic page layout to one section, broken into sub-areas for each item:

/*********** Page Layout ************/
body{}
#header{}
#header .someClass{}
#leftPanel{}
#footer{}

/*********** Generic Fonts **********/
a{}
a:hover{}
h1{}
h2{}
h3{}

/*********** News Page **************/
.newsItem{}
.newsTitle{}

So basically I will end up with a couple generic sections that supply CSS for both the page layout and for common tags I plan on using throughout the site, then I list my area specific CSS in their own sub-areas. By making the comments nice and long it makes the section breaks extremely visible when scrolling through the code.


There is no rule on how to manage code of any sort to make reading it easier. But if you find a way that works for you, name and comment things, and be consistent across your entire file, things will be much easier to find, especially the more you use a certain format.

-T

 

[monksnake]

You could do what I do a lot of times where I have a large stylesheet, and that is to use the 'find' function, just type in the selector you need to find, over time you get pretty fast with it. Most 'find' functions can be brought up with ctrl-f.