
604
Part III
Adding Advanced Design Features
10. In the dialog box, choose the just-defined CSS style from the ID list. When you click OK,
your
<div> is added to the page with some placeholder text. Now you’re ready to add your
list items.
11. Delete the placeholder text in the <div> and, from the Property inspector, select
Unordered List.
12. Enter the text for your button labels, one button per bullet. I’ve got four list items:
Home
■■
Products
■■
Services
■■
About
■■
13. Be sure to avoid placing any unnecessary paragraph returns following the list. Only the list
items you want to appear as buttons should be in the
<div> tag.
14. Add a link to each list item by selecting the text and entering a filename in the Link field
of the Property inspector. Alternatively, you can click the folder icon and choose a file from
the Select File dialog.
At this point, you have a plain bullet list of links in an absolutely positioned
<div> tag on your
page, as shown in Figure 15-9. Now you’re ready to start styling!
FIGURE 15-9
Making each list item a link is a major step toward converting them into CSS buttons.
82523c15.indd 604 2/19/09 9:13:30 AM