overflow-xとは無関係にoverflow-yを動作させる方法

Question

私はナビゲーションバー用にいくつかのCSSを作成しています。ページに収まるようにドロップダウンにはmax-heightとoverflow-y: scrollを使用する必要があります。ただし、overflow-yプロパティをスクロールするように設定すると、overflow-xもscrollに設定する必要があり、結果としてサブメニューが非表示になることが自動的に強制されます。私は私のバイオリンの使用を明確にする必要があります

は働い例えば

https://jsfiddle.net/5eyveyfz/

EDITを下記jsfiddleを参照してください。この問題は、問題のサブメニューを示す「SubMenu 1」というタイトルのメニュー項目の上にマウスを移動すると発生します。予想される動作として、このサブメニューはスクロールバーなしで表示されますが、その代わりにに設定されました

Answer 1

：

#menu > ul { 
overflow-y:scroll; 
overflow-x:hidden; 
max-height:300px; 
} 

.submenu { 
position:relative; 
display: none; 
left:0; 
top:0; 
} 

あなたは、コンテナを広くするか、または表示に変更する必要があります左の位置を維持したい場合：インラインブロック;コンテンツのサイズに調整するための幅は設定されていません。

Answer 2

あなたの実際のビルドにデータを入れることは可能でしょうか？テーブルの幅がオーバーフローするように強制していますか？

この場合は、コンテナをoverflow-x：hiddenに変更します。水平スクロールバーを防ぐためです。直接サブメニューの見出しの下にあるドロップダウンが表示されますこれらの値を変更