In full screen display, a scroll bar will appear on the body under IE7_html/css

In full screen display, a scroll bar will appear on the body under IE7_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 12:03:49

Original

1235 people have browsed it

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>demo-非全屏-使用box-sizing:content-box</title><style>*{padding:0;margin:0;border:none;}body{width:100%;height:100%;overflow:hidden;}.pr{position:relative;}.pa{position:absolute;}.pf{position:fixed;}.of-h{overflow:hidden;}.of-a{overflow:auto;}.of-s{overflow:scroll;}.wrap{width:100%;height:100%;}.header{width:100%;height:100px;background:#ccc;z-index:1;}.content{width:100%;height:auto;top:100px;bottom:100px;background:#03C;z-index:0;}.footer{bottom:0;width:100%;height:100px;background:#ccc;z-index:1;}</style></head><body class="pa"><div class="wrap pr" style="width:90%;margin:0 auto;">    	<div class="header pa of-h">header 高度100px z-index:1</div>    	<div class="content pa of-a">        	<div>content z-index:0<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />...<br />content z-index:0<br /></div>        </div>    	<div class="footer pa of-h">footer 高度100px z-index:1</div></div></body></html>

Copy after login

Everyone, let’s see where the problem is. Is it a code problem or is this just what IE7 looks like?

Reply to discussion (solution)

Add the same style to html

html,body{width:100%;height:100%;overflow:hidden;}

Copy after login

to html Add the same style

html,body{width:100%;height:100%;overflow:hidden;}

Copy after login

Thanks