0

このページにリストされているカスタムドロップダウン要素を作成しました：

http://jsfiddle.net/spryno724/2snUH/3/

[結果]セクションのドロップダウンメニューをクリックすると、問題が表示されます。展開されたドロップダウンリストの選択肢をロールオーバーすると、ロールオーバーインジケーターが使用可能な幅まで伸びていないことがわかります。

折りたたんだときのメニューの幅を維持しながら、各メニュー項目の背景色を伸ばすにはどうすればよいですか？また、各メニュー項目をそれぞれの行に残してほしい。CSSで行ったいくつかの調整により、一部のリストアイテムが独自のテキストをラップしていました。

お時間をいただきありがとうございます。

4

2 に答える 2

1

アイテムwidth: autoの代わりに負のマージンを使用します。width: 100%

UL.dropdown.open LI {
    margin: 0 -23px 0 -10px;
    padding-right: 23px;
    padding-left: 10px;
    position: relative;
    width: auto;
}

http://jsfiddle.net/2snUH/4/を参照してください。

または、の水平方向のパディングを削除しUL（代わりに水平方向のパディングを指定します）、アイテムLIに負のマージンは必要ありません。LI

于 2012-03-12T20:25:15.477 に答える
1

li要素の幅を固定するには、次を使用します。

    ul.dropdown.open {
    padding: 5px 0;
}
    ul.dropdown.open li {
        display: block;
        padding: 5px;
        text-wrap: none;
        width: 100%;
        box-sizing: border-box;
    }
于 2012-03-12T20:32:35.317 に答える