滾動條出現在Chrome，但沒有什麼可滾動

-1

我再次發佈此，因爲我不能登錄到我的舊賬。我正在使用小型投資組合網頁的模板。問題是，當網站在Chrome中打開，滾動條一直在主頁上顯示下面所示：滾動條出現在Chrome，但沒有什麼可滾動

i.stack.imgur.com/rCB3m.jpg

這不會在Firefox中發生，邊緣和IE。 Here與模板和here一個與CSS小提琴的演示的鏈接。當使用Chrome時，兩者都會顯示不必要的滾動條。我曾嘗試以下的事情：

加入這行來的HTML文件，但它並沒有幫助：

.content { 
overflow: hidden; 
}

加入這一行，但它隱藏滾動條，不僅在主頁上也對所有的子頁面。

body{ 
    overflow-y: hidden; 
}

我也刪除了部分CSS代碼，以便找出導致問題的原因。

#wrapper { 
     display: -moz-flex; 
     display: -webkit-flex; 
     display: -ms-flex; 
     display: flex; 
     -moz-flex-direction: column; 
     -webkit-flex-direction: column; 
     -ms-flex-direction: column; 
     flex-direction: column; 
     -moz-align-items: center; 
     -webkit-align-items: center; 
     -ms-align-items: center; 
     align-items: center; 
     -moz-justify-content: space-between; 
     -webkit-justify-content: space-between; 
     -ms-justify-content: space-between; 
     justify-content: space-between; 
     position: relative; 
     min-height: 100vh; 
     width: 100%; 
     padding: 4rem 2rem; 
     z-index: 3; 
    } 

     #wrapper:before { 
      content: ''; 
      display: block; 
     }

我希望你們能幫助我在這裏：當我刪除腳本的這一部分，但我不能想出一個辦法來解決這個問題的滾動條消失。

最佳，周杰倫

來源

2017-03-03 JayDan

刪除

#wrapper:before { 
    content: ''; 
    display: block 
}

...從CSS修復滾動條問題。

並保持你的內容垂直居中，#wrapper「從space-between小號justify-content改變center：

#wrapper { 
    /* ... */ 
    -webkit-justify-content: center; 
    -moz-justify-content: center; 
     -ms-justify-content: center; 
      justify-content: center; 
    /* ... */ 
}

更新fiddle。

來源

2017-03-03 18:22:03

@JayDan它既是壞的禮儀和無效要求在現有的問題或解答評論新問題。發佈一個新問題要好得多，因爲它最有可能幫助未來的訪問者提供類似的問題。這就是[如此]的作品。另外，請注意，如果您無法登錄到舊帳戶，有很多方法可以恢復。創建一個新的不是最好的方法。 –

你設置最小高度爲100視的高度，這是您正在查看的屏幕的高度，並添加填充了這一點。嘗試改爲98vh。

來源

2017-03-03 18:20:49 Stuart

滾動條出現在Chrome，但沒有什麼可滾動

回答

相關問題