動的 HTML メニューバー・ウェブレットには、widthプロパティとheightプロパティがあります。加えて、menu itemデザイナで各メニュー項目の幅及び高さを指定することができます。以下は、これらの値が合わさってどうやってメニュー・バーや最上層のアイテム、ポップアップ・メニューのアイテムの幅や高さを決定するかのまとめです。これらの幅や高さの値は、ウェブレットのorientationプロパティで選択された値によっても変わります。
Width
ポップアップ・メニューのメニュー・アイテムについて、幅はmenu itemデザイナでそのポップアップの最初のアイテムに指定された幅によって決められます。ポップアップの全てのアイテムが同じ幅になります。ウェブレットのwidthプロパティで指定された値は、これらのアイテムの幅には影響を与えません。
最上層のメニューアイテム(ページに必ず表示されるもの)については、以下のように幅が決められます。
値がウェブレットのwidthプロパティに指定されている場合、全ての最上層のメニューアイテムにそれが適用されます。(各アイテムについて幅がmenu itemデザイナで指定されていたとしても、上書きします。)
そうでない場合は、幅はメニューの方向によって以下のように変わります。
- 水平方向の場合 (orientationプロパティに'top'が指定されている場合)、各最上層アイテムに指定された幅が尊重されます。(つまり、それぞれ異なることもありえます。)
- 垂直方向の場合 (orientationプロパティに‘left’もしくは‘right’が指定されている場合)、最初の最上層アイテムに指定された幅が最上層アイテムの全てに適用されます。(つまり、全てが同じ幅になります。)
Height
ポップアップ・メニューのメニュー・アイテムについては、各アイテムに指定された高さが適用されます。つまり、アイテムによって高さが異なることもありえます。これは、1つのポップアップ・メニューの中でもそうですし、複数のポップアップ・メニューにわたってもそうです。ウェブレットのheightプロパティで指定された値は、これらのアイテムの高さには影響を与えません。
最上層のメニュー・アイテム(ページに必ず表示されるもの)については、メニュー・アイテムの高さは以下のようにメニュー・バーの方向によって変わります。
- 垂直方向の場合 (orientationプロパティに‘left’もしくは‘right’が指定されている場合)、各最上層アイテムに指定された高さが尊重されます。(つまり、それぞれ異なることもありえます。)
- 水平方向の場合 (orientationプロパティに'top‘が指定されている場合)、最初の最上層アイテムに指定された高さが最上層アイテムの全てに適用されます。(つまり、全てが同じ高さになります。)
ウェブレットのheightプロパティに値が指定されている場合、メニュー・アイテムの高さが明らかに変わることはありません。(その値がメニュー・アイテムの目に見える境界の寸法になります。)言い換えれば、最上層のメニュー・アイテムはheightプロパティの値に関わらず同じ大きさに見えるということです。その代わり、heightプロパティはメニュー・バーの為に確保された垂直方向のスペースを定義します。つまり、メニュー・バーとそれに伴うページ要素を垂直方向に区切るのに影響を与えます。
heightプロパティの値を増やすと、メニュー・バーとそれに伴うページ要素の間のスペースを増やすことができます。
heightプロパティの値を減らすと、条件によってはメニュー・バーが明らかにページ要素に重なってしまうところまで、このスペースを減らすことができます。
heightプロパティに何も値が指定されていない場合は、ウェブレットは、最初のもしくは全ての最上層メニュー・アイテムの高さによってデフォルトのスペースの大きさを決めます。 最初のメニュー・アイテムを使用するか、全てを使用するかは、メニュー・バーの方向によって変わります。