所以我有一个包含四个按钮的按钮组,第三个有一个下拉菜单,但我似乎无法将其居中对齐。按钮居中,但下拉菜单左对齐。我尝试了各种 css,但没有任何效果。也许有人可以帮忙。:)
HTML:
<div class="btn-group">
<a href="#" class="btn btn-info btn-large active">Home</a>
<a href="#" class="btn btn-info btn-large">Link</a>
<a href="#" class="btn btn-info btn-large dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Linkk1</a></li>
<li><a href="#">Linkk2</a></li>
<li><a href="#">Linkk3</a></li>
</ul>
<a href="#" class="btn btn-info btn-large">Link</a>
</div>
这是我对齐按钮组中心的方法:
.btn-group {
margin: 0 auto;
text-align: center;
font-size:0 !important;
}
.btn-group a {
display:inline-block;
}
我曾尝试对下拉菜单使用相同的方法,但没有运气。请帮忙。