2012-01-23 72 views
2

我對網站(1000px)使用固定寬度的佈局,佈局通過自動邊距在屏幕中居中。但是,我發現在網站的某些頁面上,出於某種原因,佈局的位置與其他頁面略有不同。這對我來說是令人驚訝的,因爲我使用Django併爲每個頁面提供相同的基本模板和樣式表,所以我期望它們看起來一樣。例如,看看http://crh.vkuzo.com/。如果加載「主頁」和「建議」頁面,則佈局保持完全相同。但是,如果加載「關於」頁面,則可以看到佈局稍微向左移動。網頁佈局在頁面之間稍微移動 - 如何阻止它

什麼是造成這種輕微的移動,我該如何擺脫它?

P.S.這裏是容器div的相關CSS(至少我認爲是相關的):

#wholepage { 
    width:1000px; 
    clear:left; 
    margin-top:10px; 
    margin-left:auto; 
    margin-right:auto; 
    margin-bottom:10px; 
} 
+0

可能重複的[如何防止滾動條重新定位網頁?](http://stackoverflow.com/questions/1417934/how-to-prevent-scrollbar-from-repositioning-web-page) – Quentin

+0

我相信您看到的佈局變化是由於在關於頁面上顯示了滾動條。你應該能夠通過總是顯示滾動條來解決這個問題:嘗試「overflow-y:scroll」 – dinjas

+0

@Quentin是的,沒有意識到它是滾動條並且有一個「嘟嘟嘟」的時刻:D – vasek1

回答

1

滾動條正在調整佈局。當瀏覽器窗口上出現滾動條時,它將寬度最小化爲一定量的像素(滾動條本身的寬度)。

2

添加這種風格:

body { 
    ... 
    overflow-y: scroll; 
} 

爲中心的網頁,你想要的滾動條是始終可見(不是必要,即使它)。這樣頁面將不會水平移動,這取決於滾動條是否可見。