Question

我有这样的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>

但是当我在网络浏览器中运行此代码时，高度不适合100％，它显示超过100％在CSS，我设置家庭类：身高100％在HTML中，我做2 div.set风格= 10％+ 45％+ 2％+ 33％= 90％

但是当我在网络浏览器中运行时，它超过100％（我可以滚动鼠标）

我想要100％的身高，有任何

Answer 1

有些浏览器会添加自己的填充。尝试重置填充，全局边距

* {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*/

html宽度高度100％

1 个答案: