Bootstrap全宽按钮.btn-group-vertical

Question

<div class="container">
<div class="btn-group-vertical">
<a href="3overview.php" class="btn btn-primary">Overview</a>
<a href="" class="btn btn-primary">Button</a>
<a href="" class="btn btn-primary">Button</a>
<a href="" class="btn btn-primary">Button</a>
<br>
<a href="" class="btn btn-warning">Button</a>
<a href="" class="btn btn-danger">Button</a>
</div>
</div>

我试图这样做,所以这些按钮是他们所在的容器的全宽,但我似乎无法让它工作,我已经尝试.btn-group-justified但没有任何作用.btn-group-垂直.有人可以帮忙吗？

编辑11/28/2017:标记接受的答案并修复了我发现的一些错别字.

Answer 1

据我所知,btn-group-vertical的自动设置宽度为85px.将其设置为100%,可以解决您的问题.它应该在样式表中完成,但下面是一个内联解决方案:

<div class="container">
<div class="btn-group-vertical" style="width: 100%;">
<a href="3overview.php" class="btn btn-primary">Overview</a>
<a href="" class="btn btn-primary">Button</a>
<a href="" class="btn btn-primary">Button</a>
<a href="" class="btn btn-primary">Button</a>
<br>
<a href="" class="btn btn-warning">Button</a>
<a href="" class="btn btn-danger">Button</a>
</div>
</div>

编辑:虽然这有效,但我会选择Vlads回答.它比我的好.并且工作得很好.虽然,您不必将类添加到各个按钮.将类添加到按钮组就足够了.像这样:

<div class="container">
    <div class="btn-group-vertical btn-block" style="width: 100%;">
        <a href="3overview.php" class="btn btn-primary">Overview</a>
        <a href="" class="btn btn-primary">Button</a>
        <a href="" class="btn btn-primary">Button</a>
        <a href="" class="btn btn-primary">Button</a>
        <br>
        <a href="" class="btn btn-warning">Button</a>
        <a href="" class="btn btn-danger">Button</a>
    </div>
</div>