當滾動顯示時，居中的div改變位置

我有一個居中的div容器（通過margin-left：auto和margin-right：auto）和頁面設計在加載時看起來很好... 在這個div下面還有另一個隱藏一個，這顯示在用戶請求。但是，當這種情況發生時，瀏覽器滾動顯示並且弄亂了我的設計，因爲居中的div也向左移動了幾個像素（所以它可能再次位於中心）。當滾動顯示時，居中的div改變位置

此行爲可以停止嗎？

另一種解決方案是添加overflow-y：scroll，但我發現overflow-y不被所有瀏覽器支持，並且我無法找到哪個瀏覽器... 有人可以發佈鏈接，我可以看到瀏覽器支持列表中的css3函數？

來源

2011-02-26 domagojk

爲什麼它是一個問題？因爲下面的容器不是以相同的方式居中？ – Orbit 2011-02-26 15:16:31

如果我明白這個權利，在默認狀態下你沒有窗口滾動條，但是當一個隱藏的div變得可見時，它會增加頁面長度並引入一個滾動條。你認真考慮這個「弄亂你的設計」？「overflow-y」是你最好也是唯一的選擇，但說實話，這就是網絡應該如何工作的原因：人們期望事物與它們互動時會發生變化，而出現的滾動條是一種強烈的視覺提示*有*改變了。 – 2011-02-26 16:22:12

@你可以正確地理解它，但是當我問「如何阻止這種行爲」時，我並不是想阻止卷軸出現（你可能認爲我的意思是，因爲你非常慷慨地向網絡的工作方式解釋它），但我想知道是否可以阻止div容器的這種掠奪行爲。 – domagojk 2011-02-26 16:54:10

此CSS將始終顯示您的網頁上的垂直滾動。默認情況下它是溢出：auto;

body { 
    overflow-y: scroll; 
}

來源

2011-02-28 10:13:09 Teneff

隨着滾動總是顯示，可能不適合佈局。

儘量限制體寬度用CSS3

body { 
    width: calc(100vw - 34px); 
}

vw是視口（見this link對於一些解釋）
calc計算CSS3的寬度
34px代表雙滾動條寬度（參見this爲固定的或this to calculate如果你不信任固定大小）

來源

2014-09-22 19:22:30 Moesio

當滾動顯示時，居中的div改變位置

回答

相關問題