HTML and CSS Reference
In-Depth Information
Replace blockquote/ul Indentation with CSS
Change any blockquote s or ul elements used purely to indent their contents into div s, and assign CSS rules to
the div that use the margin-left and margin-right properties to indent.
The quick brown fox jumped over the lazy dog.
<div id="i8" style="margin-left: 40px; margin-right: 40px">
The quick brown fox jumped over the lazy dog.
blockquote should be reserved for quotations. ul should be reserved for lists.
CSS offers much greater control over exactly how far any given chunk of text is indented. You also have the
option to set a right margin separately from the left margin, to indent the first line differently than the rest, to
specify a hanging indent, or anything else you can imagine. CSS is simply a more powerful and precise means of
indenting text than blockquote and ul ever were.
Potential Trade-offs
Minimal. Even if a browser cannot load the CSS stylesheet, the consequent lack of indentation has a very small
effect on the overall appearance of the page.
Finding text improperly marked up with blockquote is tricky. On some sites, there are no real blockquotes, so a
quick search for <blockquote will locate all the occurrences. However, if a site is using real blockquotes
anywhere, you'll need to inspect each example.
To find places where ul (or, less commonly, ol ) has been used to indent, first try validation. Even the
transitional XHTML DTD requires all ul and ol elements to contain at least one li child element. Lists that don't
contain any list items should pop right up with an error message such as this:
test.html:9: element ul: validity error : Element ul content
does not follow the DTD, expecting (li)+, got ()
You can also use regular expressions to locate any item-less ul elements. Because these almost always extend
across multiple lines, this is a little tricky, but it is doable:
Search WWH ::

Custom Search