次のようなドロップダウンにチェックボックスフォームを配置しようとしています。
<ul>
<li class="dropdown">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">
Dropdown Form<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><label class="checkbox"><input type="checkbox">Two</label></li>
<li><label class="checkbox"><input type="checkbox">Two</label></li>
</ul>
</li>
</ul>
ただし、デモでわかるように、何らかの理由で、実際のチェックボックス自体がドロップダウンメニューの外に表示されます。誰かがそれを引き起こしているものと、代わりにそれをどのように実装すべきかを教えてもらえますか?ラベルクラスを削除すると機能しますが、すべてがまとまっています。
Bootstrapがドキュメントでチェックボックスを使用する方法は次のとおりです。
<div class="checkbox">
<label>
<input type="checkbox">Two
</label>
</div>
したがって、次のようになります。
<ul>
<li class="dropdown">
<a href="#" data-toggle="dropdown" class="dropdown-toggle">Dropdown Form<b class="caret"></b></a>
<ul class="dropdown-menu">
<li>
<div class="checkbox">
<label>
<input type="checkbox">Two
</label>
</div>
</li>
<li>
<div class="checkbox">
<label>
<input type="checkbox">Two
</label>
</div>
</li>
</ul>
</li>
</ul>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加