響應式Twitter引導程序： <body> 當寬度<767 / 768px時，會出現導航欄右邊距/邊距

Question

當我調整767/768 px寬度以下的窗口大小時，正文和導航欄會得到一個奇怪的右邊距/填充（每個20px;在導航欄的右側總共有40個白色像素）。 我無法找到它是否是BS正常行為或我是否做錯了什么。

css大小/填充/邊距引導程序覆蓋的唯一片段是：

.navbar { margin-bottom: 20px; }

在這里HTML：

<body>
  <header class='navbar navbar-static-top'>
    <nav class='navbar-inner'>
      <div class='container'>
        <a class='btn btn-navbar' data-target='.nav-collapse' data-toggle='collapse'>
          <div class='icon-bar'></div>
          <div class='icon-bar'></div>
          <div class='icon-bar'></div>
        </a>
        <a href="/" class="brand">Brand Name</a>
        <div class='nav-collapse collapse'>
          <ul class='nav'>
            <li><a href="...">...</a></li>
            <li><a href="...">...</a></li>
            <li><a href="...">...</a></li>
          </ul>
          <form accept-charset="UTF-8" action="/search" class="navbar-search pull-right" method="get">
            <input class="search-query" id="q" name="q" placeholder="Search" type="text" />
            <input class="hidden" type="submit" value="Find" />
          </form>
        </div>
      </div>
    </nav>
  </header>
  <div class='container'>
    <div class='row'>
      <div class='span12'>
        <!-- ... -->
      </div>
    </div>
  </div>
</body>

我用rails使用bootstrap-sass gem。 我不確定.container角色。

Answer 1

我沒找到任何東西，所以我寫了這個黑客：

@media (max-width: 767px) { body { padding-left: 0; padding-right: 0; } } 
.navbar { margin-left: 0; margin-right: 0; }

Answer 2

檢查正文中的媒體填充以查找該媒體查詢。 另外，對於hack，請嘗試將以下代碼添加到處理該大小的媒體查詢中：

 .navbar-inner{
    left: 0x;
 }

響應式Twitter引導程序： <body> 當寬度<767 / 768px時，會出現導航欄右邊距/邊距

問題描述

2 個解決方案

解決方案1
1 已采納 2012-12-23 21:38:52

解決方案2
0 2012-12-23 20:28:04

響應式Twitter引導程序： <body> 當寬度&lt;767 / 768px時，會出現導航欄右邊距/邊距

問題描述

2 個解決方案

解決方案1 1 已采納 2012-12-23 21:38:52

解決方案2 0 2012-12-23 20:28:04

響應式Twitter引導程序： <body> 當寬度<767 / 768px時，會出現導航欄右邊距/邊距

解決方案1
1 已采納 2012-12-23 21:38:52

解決方案2
0 2012-12-23 20:28:04