html - 結合された高さをブラウザウィンドウの高さと等しくします

Question

.Codemirrordivと#headerdivの組み合わせは、ブラウザーの高さよりも高い高さを占めます。スクロールバーがないように、ブラウザウィンドウの合計の高さを100％にする方法を教えてください。

score 1 · Accepted Answer

組み合わせた高さをブラウザウィンドウの高さに等しくする

このコードスニペットを追加するだけです。コンテンツを100%ブラウザウィンドウに設定します。

body,html {
   height: 100%;
}

また、これを確認できます。

score 0 · Accepted Answer

私はこれに対して別のアプローチを取ります。行番号の背後にある背景のように見える、高さ 1 ピクセル、幅 30 ピクセルの小さな画像を作成し、それbodyを arepeat-yおよび整列されたに適用できますleft。divのを削除しheight:100%ます.CodeMirror

または、次のことができます

終了タグ<div class="CodeMirror-gutter bodyGutter"></div>の直前に追加してこれを CSS に追加し、divのを再度削除します。</body>height:100%.CodeMirror

.bodyGutter {
  height: 100%;
  z-index: -1;
  width: 20px;
  left: -8px;
}

これはまた、体に偽のガターを追加し、それを背景に押し付けて、高さ 100% の偽の外観を与えます。

2 に答える 2