Understanding menu bar and menu item width and height
The Dynamic HTML Menu bar weblet has width and height properties. In addition, you can specify the width and height of individual menu items in the menu item designer. Following is a summary of how these values work together to determine the width and height of the menu bar, the top-level items and the items in pop-up menus. The effect of these width and height values can also vary according to the chosen value for the orientation property of the weblet.
Width
For menu items in pop-up menus, the width is determined by the width specified in the menu item designer for the first item in that pop-up. All items in the pop-up have the same width. The value specified for the width property of the weblet does not affect the width of these items.
For the top-level menu items (those that are shown statically on the page), the width is determined as follows:
If a value is specified for the weblet width property, then it applies to all top-level menu items (it overrides the width that may have been specified in the menu item designer for individual items).
Otherwise, the width depends on the orientation of the menu bar as follows:
- When in horizontal orientation ('top' is specified for the orientation property) the widths specified for individual top-level items is respected (that is, they can be different).
- When in vertical orientation ('left' or 'right' is specified for the orientation property) the width specified for the first top-level item applies to all the top-level items (that is, they are all the same width).
Height
For menu items in pop-up menus, the height specified for individual items applies. That is the items can have different heights, both within one pop-up menu and across different pop-up menus. The value specified for the height property of the weblet does not affect the height of these items.
For the top-level menu items (those that are shown statically on the page), the menu item height depends on the orientation of the menu bar as follows:
- When in vertical orientation ('left' or 'right' is specified for the orientation property) the heights specified for individual top-level items is respected (that is, they can be different).
- When in horizontal orientation ('top' is specified for the orientation property) the height specified for the first top-level item applies to all the top-level items (that is, they are all the same height).
If a value is specified for the height property of the weblet, it does not alter the apparent height of the menu items (that is the dimensions of the visible boundary of the menu item). In other words, the top-level menu items appear to be the same size irrespective of the value of the height property. Instead, the height property specifies the vertical space reserved for the menu bar – that is, it affects the vertical spacing between the menu bar and following page elements.
By increasing the height property value you can increase the space between the menu bar and following page elements.
By decreasing the height property value you can decrease this space, even to the point that the menu bar can apparently overlap following page elements in some circumstances.
If no value is specified for the height property, the weblet allocates a default amount of space according to the height of the first or all top-level menu items, depending upon the orientation of the menu bar.