Chrome瀏覽器中的滾動條顯示當沒有任何滾動條時

Question

我正在使用this模板作爲小型投資組合網頁。問題是，當網站在Chrome中打開，滾動條一直在主頁上，如下圖所示出現：

這並不在Firefox，Edge和IE發生。 Here是一個鏈接到模板演示和here jsfiddle與CSS。當使用Chrome時，兩者都會顯示不必要的滾動條。我嘗試在html文件中添加以下行，但它沒有幫助：

.content { 
overflow: hidden; 
} 

我希望有人能幫助我。謝謝！

---

編輯：問題是這裏的某個地方，但我不能想出一個辦法來解決它。

#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; 
     } 

Answer 1

我在Chrome，當我訪問您的演示中，我看不到任何滾動條。或者這件事的小提琴

Answer 2

有什麼覆蓋您的調用來隱藏頁面上其他地方的滾動條嗎？ E.g：

overflow: auto; 

或者是它也許另一個元素在頁面上與導致問題的寬度/高度（如圖像或div元素）？

另一種選擇是去檢查員，並開始刪除項目，直到找出哪一個導致問題。

Answer 3

不完全確定會出現這種情況（確實可以看到相同的問題），但它的超級容易通過簡單地將overflow-y: hidden到身體

body{ 
    overflow-y: hidden; 
}