HTML and CSS Reference
In-Depth Information
main camps in the formatting for rules, and both have their pluses and
minuses.
Throughout this topic I commonly have written rules with one declara-
tion per line and indented one tab from the left.
#footer form.newsletter input[type=text] {
width: 120px;
margin-bottom: 5px;
color: #666;
background: #ccc;
}
This makes it easy to scan and comment on individual declarations but
may make it more difficult to scan through groups of selectors as you
work on your code. Having an entire rule on one line may make scanning
and identifying groups of rules much easier though requires some hori-
zontal scanning to find individual properties or values.
#footer { [...] }
#footer form.login { [...] }
#footer form.login input[type=text] { [...] }
#footer form.newsletter { [...] }
#footer form.newsletter p { [...] }
#footer form.newsletter input[type=text] { [...] }
#footer form.newsletter input[type=submit] { [...] }
How you organize your rules is also important. The cascade's reliance on
appearance order for selectors and specificity is a good starting point
for seeing how a document might be organized—with general and
generic rules first, followed by more specific rules for unique content
types or markup structures. But at some point your selectors will be
targeting more unique types of content and not matching the same
