クロムにスクロールバーが表示されますが、スクロールするものはありません

Question

古いアカウントにログインできないため、再度転記しています。私は小さなポートフォリオWebページのテンプレートを使用しています。 、

i.stack.imgur.com/rCB3m.jpg

これはFirefoxで発生しません。問題は、ウェブサイトがChromeで開いたときに、以下のように、スクロールバーが常にメインページに表示されるということですエッジと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; 
     } 

私はあなたたちがここで私を助けることができることを願っています。

ベスト、 ジェイ

Answer 1

スクロールバーの問題を修正するためにあなたのCSSから...

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

を削除します。

そして、垂直方向の中央centerからspace-betweenから変更#wrapperさんjustify-contentあなたの内容を保つために：

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

fiddleを更新します。

Answer 2

あなたはあなたが表示している画面の高さである100ビューポートの高さに最小の高さを設定し、それにパディングを追加しています。代わりに98vhに変更してみてください。