オーバーフロー-yを使用すると垂直クリップが発生しないようにします

Question

2レベルの水平ナビゲーションメニューがあります。 2番目のレベルは垂直方向に表示されます。第2レベルのアイテムの量は異なります。場合によっては、リストがブラウザの表示を超えている項目が十分にあります。私はその問題を防ぐためにoverflow-y:autoとmax-height:<arbitrary height>pxを使用することに決めました。しかし、今私は、スクロールバー自身のための余裕を作るためにオーバーフローしたリストのいくつかの垂直の不動産をスクロールバーの別の問題がある、水平スクロールバーは、クリップされた領域を表示することができます。

リストの幅の一部をスクロールバーで切り取らないようにするにはどうすればよいですか？ありがとうございました。

Live Example

P.S.あなたが質問のより良いタイトルを持っているなら、私に知らせてください。私はそれに苦労していた。

Answer 1

私はそれを簡単に見て、あなたの "a"タグにはパディングの両方があることに気づいた：5pxとwidth：100％;これにより、（100％+ 10px）としてレンダリングされ、10pxは常にスクロールの背後になります。

したがって、コンテナの幅を100％正確にするには、 "a"タグの埋め込みを試してください：5px 0;パディングを与える：5px;垂直ドロップメニューに移動します。

希望します。

変更点は次のとおりです。http://jsfiddle.net/XxasC/10/ 追加されたパディングによって発生する問題を修正する必要があります。

結論：100％より広いレンダリングが行われるため、要素には「幅：100％」と「左/右」の両方を指定しないでください！ （埋め込みは常に幅に追加されます - 100％さえも）