untitled

(John Hannent) #1

Note the space separating 320pxfrom heightin the preceding code example.
Well, the spaces were replaced by the wise CSS designers. With what? With
semicolons. The only reason I can think of for this casually malicious and
entirely unnecessary complication is that in C-languages such as Java, beloved
by academics, logical lines of code are separated by semicolons. Other than
that usage (which is a different context completely), I can find no evidence
that introducing a new, and bizarre, way of delimiting property/value pairs has
any explanation at all. I’d sure like to hear from the comedian who first pro-
posed this terrible idea. Maybe it was the same trickster who decided to sepa-
rate properties from their values with colons.


To my mind, simply using the same punctuation for CSS styles that everyone
was accustomed to from HTML would have made much more sense. That
way, designers and programmers wouldn’t have to keep switching mentally
between the two techniques. A CSS style should be — but alas isn’t — punc-
tuated like HTML. It would look like this:


<img border=silver outset border-width=16px>

If you’re concerned that the computer might get confused because outset
and border-width don’t have a semicolon between them, don’t worry
about it. The computer is perfectly capable of parsing such code. It has no
trouble recognizing the difference between a value and a property name. Or if
you’re concerned that this line is less readable by us humans, just break the
line into two lines, like this, in your code (the computer won’t care):


<img border=silver outset
border-width=16px>

Problem solved. Or so it would seem. Actually, in the real world, everyone has
to accept that the CSS committee people decided to employ two punctuation
systems operating side-by-side on the same information. One system only
works in a CSS style, and other in HTML code. The more you work with CSS,
the more often you’ll find that your bugs result from simple punctuation mis-
takes that are hard to see. The real mystery is why this harebrained state of
affairs was decided upon in the first place.


I cover this punctuation issue in depth here for two reasons. First, if I don’t
talk about it, I might go barking mad from sheer frustration. Second, demon-
strating all the ways that CSS punctuation differs from HTML punctuation
alerts you to the various traps you can fall into when writing a CSS rule. You
now know all the differences in the punctuation where to look most of the
time when your CSS styles don’t work as you expect.


Chapter 17: Testing and Debugging 299

Free download pdf