I am VERY new to CSS and attempting to create my first stylesheet. I’ve been Googling and checking out samples from all over, but I can’t see to find anyone who addresses this question.
I’m trying to keep the stylesheet in a logical order - body then div id’s for the basic layout (top to bottom), etc.
For my global or site wide styles, is there a recommended order to put them in?
Say I’m defining my <h2> that will apply to the entire site unless it’s defined differently in a class, would I put these up under the body? Do they need to be placed prior to any classes that would change the <h2> style?
Does it matter where they are placed? That whole "cascading" effect and all. But the examples I’ve been seeing don’t seem to have a consistent placement of styles that will apply to entire document.
-
MODX Staff
- 1,535 Posts
I always place my general site styles (such as heading and link styles,) immediately after the body statement. Then, you can override these settings if required further down in the stylesheet.
Garry Nutting
Senior Developer
MODX, LLC
Email:
[email protected]
Twitter: @garryn
Web: modx.com
If i get correct your question about CSS then the CSS hierarchy goes this way.
Priority increases
browser built in CSS file > html > parent > child Each element except html has parent.
the more class or id close to the object you want to edit the more priority it has over parent element classes and id’s
I would suggest using classes for number of elements which will act the same and id’s for unique elements, usually i assign id’s to DIVs only. Classes you can reuse for other element but Id’s not.
Thanks so much for the responses! It’s beginning to make sense.