如何在Bootstrap 3导航栏中居中按钮？

Question

尝试将按钮置于引导程序3导航栏中。我在这里找到了一些例子，但它们似乎不适用于（或使用）按钮。

这是我的例子...... http://jsfiddle.net/jayinthebay/e3hj0kzw/

我只是试图将BUTTON1，BUTTON2，BUTTON3置于导航中心。

我试过了：

text-align: center;

但我想那不是它。

Answer 1

只需将navbar-header更改为

即可

<div class="navbar-header" style="text-align: center">

为我工作。更新了小提琴here。

Answer 2

将navbar-header替换为text-center

像这样：

<div class="text-center" >  //instead of navbar-header i used text-center


            <button type="button" class="btn btn-default navbar-btn">BUTTON1</button>
            <button type="button" class="btn btn-default navbar-btn">BUTTON2</button>
            <button type="button" class="btn btn-default navbar-btn">BUTTON3</button>


            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
            </button>

        </div>

以下是Demo fiddle

Answer 3

.navbar {
    justify-content: center;
}