twitter-bootstrap - 视图展开时，引导按钮未在一行中对齐

Question

我一行有 7 个按钮，当我展开视图时，它们加起来只占视图的一半。

我想要一行中的按钮并随着视图的展开而展开。

此外，“offset-1”占用了太多空间，我想要的更少。

完整代码在这里https://codepen.io/tarekhassab/pen/ZMajop?editors=1000

<div class='container'>
<button type="button"  value="" class='btn btn-primary'> All news </button>
<button type="button" value="Technology" class='offset-1 btn btn-primary'> Technology </button>
<button type="button"  value="Business" class='offset-1 btn btn-primary'> Business </button>
<button type="button"  value="Science" class='btn btn-primary'> Science </button>
<button type="button"  value="Entertainment" class='btn btn-primary'> Entertainment </button>
<button type="button"  value="Health" class='btn btn-primary'> Health </button>
<button type="button"  value="Sports" class='btn btn-primary'> Sports </button>
</div>

标签： twitter-bootstrap

Answer 1

我通过添加解决了它text-center

<div class='container text-center'>
<button type="button"  value="" class='btn btn-primary'> All news </button>
<button type="button" value="Technology" class='offset-1 btn btn-primary'> Technology </button>
<button type="button"  value="Business" class='offset-1 btn btn-primary'> Business </button>
<button type="button"  value="Science" class='btn btn-primary'> Science </button>
<button type="button"  value="Entertainment" class='btn btn-primary'> Entertainment </button>
<button type="button"  value="Health" class='btn btn-primary'> Health </button>
<button type="button"  value="Sports" class='btn btn-primary'> Sports </button>
</div>