Dreamweaver CSS – Spry Menu

Posted by: Ping

Before | After
Get the exercise asset here

1. In Dreamweaver, choose Site > New Site
2. Select the text “Menu Goes Here”, then delete the text
3. Insert > Spry > Spry Menu Bar
4. Delete items / add items for creating sub-menus
5. In CSS panel, select ul.MenuBarHorizontal a (change bgcolor to #CCC)
6. Make the following changes:
Font-family: Arial, Helvetica, sans-serif
Font-size: 11 px
Font weight: bold
Font-color: #000
7. Click OK
8. Select ul.MenuBarHorizontal a:hover
(change the bgcolor to #274463)
9. Select the 2nd style below ul.MenuBarHorizontal a
(change the bgcolor to #274463)
10. Select ul.MenuBarHorizontal a (change padding right to 1.3em
11. Select the 3rd style from the top:
ul.MenuBarHorizontal li (adjust the width)