HTML and CSS Reference
In-Depth Information
because HTML elements can vary in case. However, in the case of XML elements like
MYTAG {color: red;}
and
mytag {color: red;}
these wouldn't necessarily be the same. Similarly, given the intersection of JavaScript, which
is case sensitive,
id
and
class
names should be considered to be case sensitive. Depending
on the server being used, portions of URL values, including the path and filename, may also
be case sensitive. So, the rules of CSS can cause much confusion because they are highly
influenced by its context of use. There are clear cases, however, that syntax is incorrect or at
least not understood by the parsing user-agent; fortunately, the CSS specification spells out
what ought to be done in such situations, though this assumes browser vendors follow the
specification!
CSS Error Handling
As discussed in the previous chapter, the use of syntactically correct markup is certainly not
encouraged by permissive browser parsers that correct mistakes or guess intent when faced
with malformed markup. The situation for CSS is a bit better, and the CSS 2.1 specification does
describe what browsers should do in the case of various errors (www.w3.org/TR/CSS21/
syndata.html#parsing-errors), but then again, making the assumption that browsers are not
permissive and correctly implement all aspects of Web specifications is dangerous.
Unknown Properties
If an unknown property is encountered, a CSS-conforming user agent should ignore the
declaration. Given
h1 {color: red; trouble: right-here;}
the property
trouble
would simply be ignored and the rule would simply set the color. It
does not matter what the position of the bogus property declaration is, the result should be
the same as long as the declaration is otherwise well formed.
h1 {trouble: right-here; color: red;}
The case is obviously different if the various separators are missing.
Malformed Rules
In the case where semicolons (;), colons (:), quotes ('or"), or curly braces ( { } ) are misused,
a browser should try to handle any unexpected characters and read the properties until
a matching value can be found. As an example, consider the simple case of forgetting a
semicolon:
h1 {color: red text-decoration: underline; font-style: italic;}
In this case, we should see the browser continue to parse the value of
color
as “red text-
decoration: underline” before it sees a closing semicolon. The
font-style
property that
