在全屏模式下控制div

时间:2012-06-03 05:34:39

标签: html5 html

<body style="margin: 0pt auto;">
<div id="header" style="background-color:#000033; width:auto; height:70px"></div>
<div id="body" style="background-color: rgb(153, 153, 153); width: 100%; position: absolute; margin-right: 300px; margin-left: -300px; height: 76%;"></div>
<div id="nav" style="position: absolute; left: 1066px; width: 300px; top: 70px; height: 76%; background-color: rgb(221, 34, 221);"></div>
<div id="footer" style="background-color:#000033; width:100%; height:70px; position:absolute; bottom:0"></div>
</body>

* 全屏视图 *

http://i.stack.imgur.com/VukrD.jpg

当我们处于全屏模式时如何删除空格?喜欢普通视图,如下所示:

http://i.stack.imgur.com/DhtwT.jpg

1 个答案:

答案 0 :(得分:1)

存在白色差距,因为您无法保证70px + 76% + 70px == 100%。事实上,它有可能没有,你只是得到76%值,因为你尝试了不同的数字,直到它适合。

由于它们是绝对位置元素,请尝试使用bottom: 70px;而不是高度。