3

代码很简单：

<html xmlns="http://www.w3.org/1999/xhtml">
    <body style="padding:0; margin:0;">
        <form method="post" action="/default.aspx" id="form1" style="margin: 0px; padding: 0px;">
          <div id="container-main" style="background-color:Red; height:1825px; position:relative;">&nbsp;</div>
          <div id="fascia-chiusura" style="background-color:#5CAE22; height:11px; position:relative; width:100%;">&nbsp;</div>
        </form>
    </body>
</html>

但是在 Firefox/Chrome 上，它在底部有一个奇怪的“空格”，它不在 HTML 元素中。为什么会有这种行为？我该如何解决？

截屏 ：

在此处输入图像描述

4

4 回答 4

8

http://jsfiddle.net/rtVPb/4/

删除&nbsp;最后一个 div 中的 ，它工作正常。来自 div 的空间&nbsp;大于 div 中定义的 11px，因此它会产生溢出，并且您会得到一个白色部分。您可以在此处检查此行为，我在其中添加了一些可见文本。

于 2012-09-27T07:43:17.670 回答
0

http://jsfiddle.net/rtVPb/2/

删除这个：

 <div id="fascia-chiusura" style="background-color:#5CAE22; height:11px; position:relative; width:100%;">&nbsp;</div>
于 2012-09-27T07:42:02.047 回答
0

您还可以添加overflow:hidden到<div id="fascia-chiusura"/>

http://jsfiddle.net/rtVPb/9/

于 2012-09-27T07:44:03.173 回答
0

什么都没有，只要去掉最后一个div的高度或者改成auto

http://jsfiddle.net/rtVPb/8/

于 2012-09-27T07:49:45.117 回答