I'm hoping for some good answers here, because I'd love a better way.
I always put universal elements first (body, img, @font-face, etc.), then I just organize it top to bottom by page location (i.e. header, content, sidebar, footer, etc.). I also tab-indent so that elements within another are indented and "contained" underneath, making it easy for me to move from one section to the next. I also write the CSS horizontally, only making a new line for a new element.
I should also note that I'm a n00b :-), so this could be a horrible way to do it.
With the exception of the horizontal CSS (personal preference - unless its compressed, I prefer things on new lines), I like everything you said.
(I actually find the tab-indented elements really interesting and may have to try it on my next project!)
One thing you didn't mention were comments. I've seen some css files with great commenting. For instance, comments at the top that act as an index/table of content for the css file. Very nice!
I do it more or less the same way, except I try to separate the layout from its content (I'll put #header, #content, #sidebar, #footer together, and later on define stuff that is specific to the content of e.g. #header).
Also, when having quite a few properties for a selector, it's quite difficult to read when all is on one long line, so I use new lines for each property.
I always put universal elements first (body, img, @font-face, etc.), then I just organize it top to bottom by page location (i.e. header, content, sidebar, footer, etc.). I also tab-indent so that elements within another are indented and "contained" underneath, making it easy for me to move from one section to the next. I also write the CSS horizontally, only making a new line for a new element.
I should also note that I'm a n00b :-), so this could be a horrible way to do it.