Hi cybmole
The order in which styles appear in the stylesheet has no effect on how they are applied. They can appear in any order in the stylesheet. When theducks referred to placing "noindent" after "calibre10", he was referring to the order in which those classes are listed in the "class" attribute for "p" elements.
Example
If we have in the stylesheet:
Code:
.noindent {
text-indent: 0;
}
.standardpara {
margin-top: 1em;
margin-bottom: 1em;
text-indent: 0.3em;
}
Then, in the HTML code:
Code:
<p class="standardpara noindent">bla bla bla</p>
that says:
- First, apply the formatting defined for class "standardpara" to this paragraph.
- Next, apply the formatting defined for class "noindent" to this paragraph.
That way, you get all the formatting defined for class "standardpara" (such as the top and bottom margins) except where the formatting defined for class "noindent" specifies something different (the first line indent).
The order in which the styles are listed in the stylesheet has no effect whatsoever, but the order in which the classes are listed in the "class" attribute is important, since they are applied in sequence, from left to right, with each one overriding the one(s) to the left where the same CSS properties are defined in each style involved (in this case, the "text-indent" property). In this example, the result is that this paragraph will have the following formatting applied to it:
margin-top: 1em; (from "standardpara" style)
margin-bottom: 1em; (from "standardpara" style)
text-indent: 0; (from "noindent" style, overriding the text-indent value specified in the "standardpara" style, because "noindent" is listed after "standardpara" in the "class" attribute value list)
This is one way in which styles "cascade" in CSS, meaning that you shouldn't have to define every aspect of the desired formatting in every single style definition, as long as you use the style hierarchy appropriately.