Most Common Errors - Web Standards: Mastering HTML5, CSS3, and XML - page 463

Listing 15-1. A Bad Practice That Should Never Be Used
<p>This is a very bad practice
<p>dating back to the early days
<p>of the Web
<p>unfortunately it is still in use
<p>even if it has many drawbacks, e.g.,
<p>illogical
<p>hard to identify related content
The technique of omitting end tags should be forgotten. Although it is allowed in HTML, it is not a clean code
and is invalid in XHTML. Beginners with a basic (X)HTML knowledge might think that br elements should be added
to the end of each line instead of incorrectly forcing line break with paragraphs. They are wrong.
Web content should be logical. The first five rows should belong to a paragraph, and the last two should belong to
an unordered list. The previous example should be written as shown in Listing 15-2.
Listing 15-2. The Correct Markup for Listing 15-1
<p>This is a very bad practice dating back to the early days of the Web. Unfortunately it 
is still in use even if it has many drawbacks, e.g.,</p>
<ul>
<li>Illogical</li>
<li>Hard to identify related content</li>
</ul>
Text width can be set by external style sheets in order to achieve similar (or exactly the same) effect expected from
the original example. It all depends on the content and the publishing needs. In this case, the markup in Listing 15-3
with the appropriate style in the external CSS file shown in Listing 15-4 would be a standard solution.
Listing 15-3. A More Advanced Solution
<div id="thinbox">
<p>This is a very bad practice dating back to the early days of the Web. Unfortunately it 
is still in use even if it has many drawbacks, e.g.,</p>
<ul>
<li>Illogical</li>
<li>Hard to identify related content</li>
</ul>
</div>
Listing 15-4. CSS Ruleset for Listing 15-3
.thinbox {
width: 400px;
height: 600px;
font-size: 14px;
}