0

サブメニューがメイン メニューの右側に表示されるようにブートストラップ v2 でサブメニューを作成するには、マニュアルでは .pull-left を使用することを提案していますが、この場合、サブメニューはメイン メニューと少なくとも等しいオフセットでレンダリングされるようです。幅。サブメニューの幅が狭い場合、サブメニューとメイン メニューの間にギャップが生じます。

http://jsfiddle.net/5BUXu/1/を参照

<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px; *width: 180px;">
<li><a tabindex="-1" href="#">Action</a></li>
<li><a tabindex="-1" href="#">Another action</a></li>
<li><a tabindex="-1" href="#">Something that is a really really really long string here</a></li>
<li class="divider"></li>
<li class="dropdown-submenu pull-left"> <a tabindex="-1" href="#">More options</a>
    <ul class="dropdown-menu">
        <li><a tabindex="-1" href="#">shorter things</a></li>
        <li><a tabindex="-1" href="#">shorter things</a></li>
        <li><a tabindex="-1" href="#">shorter things</a></li>
    </ul>
</li>

ギャップをなくすことは可能ですか？

私が試したハッキーな回避策は、サブメニュー ul 要素の幅を 100% に設定することです。ギャップをなくすために機能しますが、サブメニューの自然な幅を維持するソリューションが望ましいです。

4

1 に答える 1