HTML and CSS Reference
In-Depth Information
When coded, the
<dt>
and
<dd>
tags are placed in pairs, within the enveloping
<dl>
tag, like this:
<dl>
<dt>Acquittal</dt>
<dd>Judgement that a criminal defendant has not been proved guilty beyond a
reasonable doubt.</dd>
<dt>Allegation</dt>
<dd>Something that someone says happened.</dd>
<dt>Chambers</dt>
<dd>A judge's office</dd>
</dl>
Typically, browsers render the definition list with the terms on one line and the data on the line
below it, indented, as shown in Figure 15-4.
FiGure 15-4
Naturally, you can manipulate the look-and-feel of a definition list however you like through CSS.
For example, if you wanted to put both the
<dt>
and
<dd>
tag values on the same line, with a
bolded definition term, your CSS rule might look like this:
dt {
float: left;
font-weight: bold;
padding-right: 5px;
}
The
padding-right
property is used to create a little distance between the term and its definition,
as shown in Figure 15-5.
