Convention for ordering a style sheet

[David Segall]

I have (almost) decided to arrange my style sheets in alphabetical
order. It seems to work reasonably well for properties although I
would prefer it if bounding box properties like margin and border were
together.

I am prepared to name classes so that similar classes are collected.
So, for example, imageLeft and imageRight are clumsier than leftImage
and rightImage but I can live with it.

Can someone suggest a superior, well defined, order?

 

[Lars Eighner]

I have (almost) decided to arrange my style sheets in alphabetical
order. It seems to work reasonably well for properties although I
would prefer it if bounding box properties like margin and border were
together.

I am prepared to name classes so that similar classes are collected.
So, for example, imageLeft and imageRight are clumsier than leftImage
and rightImage but I can live with it.

Can someone suggest a superior, well defined, order?

Maybe not. But what I do involves styling stuff three times. First to
standardize stuff (such as relative heading sizes) that vary from browser to
the browser and fix stuff like nesting of elements that are usually rendered
in italics, then for the basic structure, and finally for pretty-pretty like
colors and fonts.

 

[richard]

I have (almost) decided to arrange my style sheets in alphabetical
order. It seems to work reasonably well for properties although I
would prefer it if bounding box properties like margin and border were
together.

I am prepared to name classes so that similar classes are collected.
So, for example, imageLeft and imageRight are clumsier than leftImage
and rightImage but I can live with it.

Can someone suggest a superior, well defined, order?

Which style has priority?
If you're styling a box, I would do height/width first, borders, margin,
padding, then anything that goes inside the box.
Stuff like position should be first.

As for naming, avoid using names that might clash with tag names.
body2 might be confused with body. So add something to the beginning so the
browser knows it's not a tag. Such as BoxBody.

 

[Roy A.]

Which style has priority?
If you're styling a box, I would do height/width first, borders, margin,
padding, then anything that goes inside the box.
Stuff like position should be first.

As for naming, avoid using names that might clash with tag names.
body2 might be confused with body. So add something to the beginning so the
browser knows it's not a tag.

I will suggest you add something '.' or '#' e.g. .body or #body. That
would be less confusing. No browser that I know of would be confused
by .body2, #body2 or .body, #body.