如何让这个Bootstrap导航栏具有正确的边距并在断开时对齐？

Question

我试图让Bootstrap 3导航栏正常崩溃，但仍有两个未解决的问题：

1. 边距不相等：



1. 当导航栏中断时，图标不会与文本保持对齐：



我知道如何才能添加样式修复，直到我做对了，但我如何正确解决？

https://jsfiddle.net/edwardtanguay/v83aj4cn/3

<div class="container">
    <nav class="navbar navbar-inverse">
        <div class="navbar-inner">
            <div class="container-fluid">
                <div class="navbar-collapse">
                    <a class="navbar-brand navbar-brand-centered" href="#">
                        <span class="glyphicon glyphicon-menu-hamburger"></span>
                    </a>
                    <a class="navbar-brand navbar-brand-centered" href="#">
                        <span class="glyphicon glyphicon-cog"></span>
                    </a>
                    <a class="navbar-brand navbar-brand-centered" href="#">
                        <span class="glyphicon glyphicon-plus"></span>
                    </a>
                    <a class="navbar-brand navbar-brand-centered" href="#">
                        <span class="glyphicon glyphicon-minus"></span>
                    </a>
                    <p class="navbar-text">Company Name</p>
                    <p class="navbar-text">CUSTOMER PORTAL</p>
                    <p class="navbar-text navbar-right"><a href="#">Contact Name</a></p>
                    <p class="navbar-text navbar-right">2016-04-14</p>
                </div>
            </div>
        </div>
    </nav>
</div>

Answer 1

There you go friend!

SOLUTION JDSFILE

Regards!