Bootstrap充當980px - 1200px的移動設備

我最近開始使用Bootstrap，除了遇到這個問題之外沒有任何問題。我已經建立了自己的個人網站使用它，並將其設計爲響應式，至今在任何事情上看起來都很棒。Bootstrap充當980px - 1200px的移動設備

但我遇到的問題是，從980px - 1200px，Bootstrap呈現整頁頁面中的頁面（就像它在移動時一樣）。我使用的是自舉responsive.min我的頁面設置爲：

<div class="row-fluid"> 
     <div class="span3"> <!-- sidebar here --> </div> 
     <div class="span8"> <!-- content of each page --> </div> 
     <div class="span1"> &nbsp; <!-- empty for spacing --> </div> 
</div>

980px-1200像素是它正確呈現唯一的間隔，我至今擁有該時間間隔內沒有媒體查詢。有沒有人遇到過這個問題？或者是否有人知道可能會造成這種情況？

一個頁面的例子可以在這裏看到（你會發現，如果你慢慢地調整瀏覽器窗口）： http://portfolio.jrstrauss.net/work/

來源

2013-04-30 Russell Strauss

[編輯]這是完全不同的東西：你需要重寫/解決您的HTML，例如您可以將.span3應用於header元素，以便按預期漂浮。第二塊也是一樣。

<header class="row-fluid" style="display: inline-block;"> 
    <nav class="main span3"> 
     … 
    </nav> 
</header>

你基本上確實設置了正確的類，但隨後在裏面添加了全寬塊元素。

來源

2013-04-30 20:50:49 nietonfir

你有一個媒體查詢瞄準屏幕寬度達979px，

@media (max-width: 979px) and (min-width: 768px)

和下一個瞄準的1200像素的屏幕寬度和高達

@media (min-width: 1200px)

什麼980px和1200像素在中間會使用默認樣式。您可以通過將第二個媒體查詢更改爲最小寬度：980像素而不是1200像素來解決此問題。

來源

2013-04-30 21:00:31 andymacd

出於某種原因，此功能被烘焙到bootstrap-responsive.css中。我不明白爲什麼。但是，這個修復工程！ – 2015-03-25 17:55:49

Bootstrap充當980px - 1200px的移動設備

回答

相關問題