Working With The Collapsible Panel Widget - Adobe 38040334 - Dreamweaver CS3 User Manual

Color to change
Default background
Background color when mouse
pointer moves over it
Background color when in focus
Menu Bar item color when mouse
pointer moves over it
Submenu item color when mouse
pointer moves over it
Change the dimension of menu items
You change the dimension of menu items by changing the width properties of the menu item's
Locate the
1
ul.MenuBarVertical li
2 Change the width property to a desired width (or change the property to
the property and value
white-space: nowrap;
3 Locate the
ul.MenuBarVertical ul
Change the width property to a desired width (or change the property to
4
Locate the
5
ul.MenuBarVertical ul li
Add the following properties to the rule:
6
Delete the
7
width: 8.2em;
Position submenus
The position of Spry Menu Bar submenus is controlled by the margin property on submenu
Locate the
1
ul.MenuBarVertical ul
2 Change the
margin: -5% 0 0 95%;

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:
CSS rule for vertical or horizontal
menu bar
ul.MenuBarVertical a, ul.MenuBarHo-
rizontal a
ul.MenuBarVertical a:hover,
ul.MenuBarHorizontal a:hover
ul.MenuBarVertical a:focus,
ul.MenuBarHorizontal a:focus
ul.MenuBarVertical a.MenuBarItem-
Hover, ul.MenuBarHorizontal
a.MenuBarItemHover
ul.MenuBarVertical a.MenuBarItem-
SubmenuHover, ul.MenuBarHori-
zontal a.MenuBarItemSubmenu-
Hover
or
ul.MenuBarHorizontal li
to the rule).
or
ul.MenuBarHorizontal ul
or
ul.MenuBarHorizontal ul li
and
float: none;
property and value.
or
ul.MenuBarHorizontal ul
default values to the desired values.
September 4, 2007
Relevant properties and default
values
background-color: #EEE;
background-color: #33C;
background-color: #33C;
background-color: #33C;
background-color: #33C;
rule.
to remove a fixed width, and add
auto
rule.
to remove a fixed width).
auto
rule:
background-color: transparent;
ul
rule.
DREAMWEAVER CS3 458
User Guide
and tags.
li ul
.
tags.