Bootstrapのnavbar-brandを中央寄せする

navbar-brandを中央寄せする方法です。
Webで調べると結構出てくるのですが、微妙に中央からずれていたりスマートフォンだとメニューボタンが効かなくなったりといろいろ不具合があったのでそれらを解決するcssを書いてみました。

.navbar-toggle {
    z-index: 2;
}

.navbar-brand-center {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    text-align:center;
    margin: auto;
}

@media (min-width: 768px) {
    .navbar-brand-center {
        margin-left: 0 !important;
    }
}

navbar-brandのクラスにnavbar-brand-centerを追加してあげればOKです。