web-dev-qa-db-ja.com

HTML CSS LIラッピング

私のシステムには、基本的にHTML ul/liで作成された垂直メニューがあり、CSSスタイルが設定されています(下の画像を参照)。ただし、メニューよりも幅の広いliアイテムをラップしたくないので、メニューの下部にある水平スクロールバーでオーバーフローすることをお勧めします。 CSSでこれを行うにはどうすればよいですか?

24
Craig
ul {
  overflow: auto;  // allow li's to overflow w/ scroll bar
                   // at the bottom of the menu
}

li {
  white-space: nowrap; // stop the wrapping in the first place
}
51
Owen

使用する white-space:nowrap。そのようです:

li {
  white-space:nowrap;
}

これが documentation です。

7
sblundy

スタイルにulを指定する必要もあります。

ul{
 width:250px;
 overflow:auto;
}
2
slashnick