
DREAMWEAVER CS3
User Guide
458
Change the dimension of menu items
You change the dimension of menu items by changing the width properties of the menu item’s li and ul tags.
1 Locate the ul.MenuBarVertical li or ul.MenuBarHorizontal li rule.
2 Change the width property to a desired width (or change the property to auto to remove a fixed width, and add
the property and value
white-space: nowrap; to the rule).
3 Locate the ul.MenuBarVertical ul or ul.MenuBarHorizontal ul rule.
4 Change the width property to a desired width (or change the property to auto to remove a fixed width).
5 Locate the ul.MenuBarVertical ul li or ul.MenuBarHorizontal ul li rule:
6 Add the following properties to the rule: float: none; and background-color: transparent;.
7 Delete the width: 8.2em; property and value.
Position submenus
The position of Spry Menu Bar submenus is controlled by the margin property on submenu ul tags.
1 Locate the ul.MenuBarVertical ul or ul.MenuBarHorizontal ul rule.
2 Change the margin: -5% 0 0 95%; default values to the desired values.
Working with the Collapsible Panel widget
About the Collapsible Panel widget
A Collapsible Panel widget is a panel that can store content in a compact space. Users hide or reveal the content
stored in the Collapsible Panel by clicking the tab of the widget. The following example shows a Collapsible Panel
widget, expanded and collapsed:
Color to change CSS rule for vertical or horizontal
menu bar
Relevant properties and default
values
Default background ul.MenuBarVertical a, ul.MenuBarHo-
rizontal a
background-color: #EEE;
Background color when mouse
pointer moves over it
ul.MenuBarVertical a:hover,
ul.MenuBarHorizontal a:hover
background-color: #33C;
Background color when in focus ul.MenuBarVertical a:focus,
ul.MenuBarHorizontal a:focus
background-color: #33C;
Menu Bar item color when mouse
pointer moves over it
ul.MenuBarVertical a.MenuBarItem-
Hover, ul.MenuBarHorizontal
a.MenuBarItemHover
background-color: #33C;
Submenu item color when mouse
pointer moves over it
ul.MenuBarVertical a.MenuBarItem-
SubmenuHover, ul.MenuBarHori-
zontal a.MenuBarItemSubmenu-
Hover
background-color: #33C;
Komentarze do niniejszej Instrukcji