顯示移動時引導不需要的空白空間

我使用引導與我的網站，並遇到一些奇怪的空白，我似乎無法擺脫。如果有人遇到過這種情況，只能在幾臺設備上發生Iphone6，Galaxy S4，Galaxy Note 3.顯示移動時引導不需要的空白空間

有margin: 0; padding: 0;，在<li>上。

<ul class="nav nav-justified"> 
    <li class="active"><a href="#">Home</a></li> 
    <li><a href="#">FAQ</a></li> 
    <li id="large"><a href="#" id="large" class="play">PLAY</a></li> 
    <li><a href="#">Promotions</a></li> 
    <li><a href="#">Support</a></li> 
    </ul>

繼承人這是我的意思是關於空白的圖像。

enter image description here

這是什麼樣子的大多數設備：

enter image description here

來源

2015-06-25 Spade

需要更多的信息（特別是CSS），直到我看到，你有沒有嘗試設置'border：none'？ –

你可以在這裏查看網站，如果你想要和檢查員/螢火蟲混在一起，看看css，http://c2-tech.com它仍然在生產，所以不要介意任何錯誤或混亂的代碼。邊界沒有不解決問題 – Spade

您必須添加border-top: value;和border-bottom: value在li標籤來得到這樣的結果。

這就是我所做的，我檢查了頁面，並添加了border-bottom：1px solid #fff; border-top：1px solid #fff;到李元素。對於你所期望的觀點來說，這是沒有問題的。所以你必須在這個位置的ul li標籤中添加這種樣式。

來源

2015-06-25 06:15:03

我嘗試了這幾種不同的方式，沒有邊框，與背景顏色相同的邊框，沒有邊框底部等等。總是空白回來由於某種原因 – Spade

你能給我們...樣式表？ –

查看以上評論到Matthew Rath – Spade

嘗試。在您的custom.css

.nav-justified > li > a { 
    padding-top: 15px; 
    padding-bottom: 15px; 
    /* margin-bottom: 0;*/ 
    font-weight: bold; 
    color: white; 
    text-align: center; 
    background-color: #14222d; /* Old browsers */ 
    }

來源

2015-06-25 06:54:12

刪除margin-bottom: 0;在你INTIAL問題，從開發視圖只是一個截圖是嗎？

我相信這只是第一次切換到移動設備模式時的渲染錯誤。

我可以複製它，然後注意當我切換到iphone 6預覽，然後回到S4 (link)時，會發生什麼情況，問題會自行解決。我對CSS完全沒有做任何事情，只是刷新了視圖，因此我認爲它一定是開發工具問題。

如果你希望100％確定，你可以在本地通過NodeJS運行類似瀏覽器同步的東西，然後連接實際的S4或iPhone並檢查。或者像browserstack那樣使用實際操作系統的虛擬機來確保最準確的結果。

來源

2015-06-26 07:05:20

顯示移動時引導不需要的空白空間

回答

相關問題