キャレットの正しい配置に問題があります。スパンで.pull-rightを使用すると、右上隅に移動します。
どうすれば垂直方向の中央に戻すことができますか？また、テキストを左揃えにしたい
http://www.bootply.com/r8x7g5Bw5R
<div class="btn-group cust-dropdown">
<button type="button" class="btn btn-default dropdown-toggle cust-dropdown" data-toggle="dropdown"><span class="caret pull-right"></span><span>test</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">test</a></li>
<li><a href="#">tes2</a></li>
<li><a href="#">test3</a></li>
</ul>
</div>
とCSS
.cust-dropdown {
width: 200px;}
HTMLのキャレットブロックとスパンブロックを交換するだけです。
HTML
<div class="btn-group cust-dropdown">
<button type="button" class="btn btn-default dropdown-toggle cust-dropdown" data-toggle="dropdown"><span id= "titl">test</span><span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="#">test</a></li>
<li><a href="#">test 2</a></li>
<li><a href="#">test 3</a></li>
</ul>
</div>
CSS
.cust-dropdown {
width: 200px;
}
#titl {
padding-right: 10px;
}
さらにを追加することで、テキストをより左に揃えることができますpadding-right。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加