Bootstrap,左右导航栏空格。保证金:0;不工作

时间:2015-10-22 20:30:25

标签: twitter-bootstrap

此导航栏在左侧和右侧造成明显的空白区域。我试过保证金:0;但它没有回应它。我已经有了一个看起来像的导航栏:

<div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-left">

            <button class="navbar-toggle" data-toggle="collapse"
                data-target=".navHeaderCollapse">
                Menu <span class="icon-bar"></span>
            </button>

            <div class="collapse navbar-collapse navHeaderCollapse">
                <ul class="nav navbar-nav navbar-left">
                    <li><a href="Handler?action=mainPage">Home</a></li>
                    <li><a href="Handler?action=logOut">Log out</a></li>
                    <li><a href="Handler?action=profile">Profile</a></li>
                    <li><a href="Handler?action=eventManager">Manager</a></li>
                </ul>
            </div>
        </div>
    </div>

上面的那个不会造成任何麻烦。所以对我来说似乎很奇怪另一个几乎应该相等。

           <div class="navbar navbar-inverse hidden-lg" id="tea">
                <div class="container-left">
                    <button class="navbar-toggle" data-toggle="collapse"
                        data-target=".bot12">
                        Menu <span class="icon-bar"></span>
                    </button>

                    <div class="collapse navbar-collapse bot12">
                        <ul class="nav navbar-nav navbar-left">
                            <li><a href="Handler?action=mainPage">Home</a></li>
                            <li><a href="Handler?action=logOut">Log out</a></li>
                            <li><a href="Handler?action=profile">Profile</a></li>
                            <li><a href="Handler?action=eventManager">Manager</a></li>
                        </ul>
                    </div>
                </div>
            </div>

1 个答案:

答案 0 :(得分:1)

&#34;重要的空白&#34;导航栏上的问题是由于您错过了标记上的navbar-static-topnavbar-fixed-top而造成的:

<div class="navbar navbar-inverse navbar-static-top hidden-lg" id="tea">
  <div class="container-left">
    <button class="navbar-toggle" data-toggle="collapse"
    data-target=".bot12">
      Menu <span class="icon-bar"></span>
    </button>

    <div class="collapse navbar-collapse bot12">
      <ul class="nav navbar-nav navbar-left">
        <li><a href="Handler?action=mainPage">Home</a></li>
        <li><a href="Handler?action=logOut">Log out</a></li>
        <li><a href="Handler?action=profile">Profile</a></li>
        <li><a href="Handler?action=eventManager">Manager</a></li>
      </ul>
    </div>
  </div>
</div>

添加它会删除空白并修复圆角(不应该在那里)。

Booyply Example