0

私はこのようなcssを持っています

.home{        
    height:100%;
    width:100%; 
    font-size:20px;     
}

そして、私はこのようなhtmlを持っています

<div class="home">
        <div style="text-align:center;padding-top:10%;height:45%;">first text here
        </div>
        <div style="padding-top:2%;height:33%;background:#0099FF;text-align:center;">second text here           
        </div>      
        </div>

しかし、このコードを Web ブラウザーで実行すると、高さが 100% に収まらず、css で 100% 以上表示されます。ホーム クラスを設定します。 %+2%+33% = 90%

しかし、Webブラウザーで実行すると100％以上になります（マウスを下にスクロールできます）

私は100％の高さが欲しい、ある

4

1 に答える 1

0

一部のブラウザーは、独自のパディングを追加します。パディング、マージンをグローバルにリセットしてみてください

* {margin:0;padding:0;}

IE7 のサポートが不要な場合は、パディングとマージンと共にこれらを追加することもできます。計算がかなり楽になります

 -webkit-box-sizing: border-box; /* <=iOS4, <= Android  2.3 */
 -moz-box-sizing: border-box; /* Firefox 1+ */
      box-sizing: border-box; /* Chrome, IE8+, Opera, Safari 5.1*/
于 2012-11-11T14:43:54.560 に答える