gif);
}2. Amend the body and #wrapper CSS rules, adding some padding to the former (so
the content doesn??™t hug the browser window edges during testing) and a shorthand
font definition to the latter (in place of existing content).
body {
font: 62.5%/1.5 Verdana, Arial, Helvetica, sans-serif;
padding: 20px;
}
#wrapper {
font: 1.2em/1.5em 'Lucida Grande', 'Lucida Sans Unicode', Lucida,
?? Arial, Helvetica, sans-serif;
}
Displaying blocks of code online
When creating lists such as this, don??™t overcomplicate things, and try to avoid going to
many levels of nesting, or combining ordered and unordered lists; otherwise, the
selectors required for overrides become extremely complicated.
WORKING WITH TYPE
115
3
3. Style the list. Add the following rule, which adds a solid border around the definition
list that has a codeList class value:
.codeList {
border: 1px solid #aaaaaa;
}
4. Style the definition term element. Add the following rule, which styles the dt element.
The rule colors the background of dt elements within any element with a
class value of codeList, and also adds some padding so the content of the dt
elements doesn??™t hug their borders. The font-weight value of bold ensures the
content stands out, while the border-bottom value will be used as a device
throughout the other rules, separating components of the design with a fairly thin
white line.
Pages:
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194