我已经阅读了几个关于此的答案,但我找不到合适的答案。我创建了一个容器div
并在其中创建了 3 个单独div
的 s,并使用 CSS 定位对它们进行了定位。在底部我有一个页脚div
,但是当我在浏览器中加载页面时,页脚下方有额外的空间。我不想使用粘性页脚,因为我页面上的内容是动态加载的,因此页面高度会动态变化。
我认为问题在于浏览器在解析页面时添加了每个 div 的高度,并将该总和设置为文档的高度。Asdiv
是块级元素,它们的流量在正常流量中低于另一个。
因此,即使div
使用 CSS 的定位属性(top
, left
, etc
)来定位 s,浏览器仍然会在它们的正常流程中解析它们,从而将它们的高度相加(以它们在正常流程中出现的上下方式),从而导致额外的页脚下方的空间,好像内部div
s ( b
, c
, d
) 溢出页脚(它们没有定位)。
我只想知道如何指示我的浏览器忽略那个额外的空间。
这是我的代码(另见现场示例)
<html>
<head>
<style>
#container{width:1000px;height:600px;border:2px solid black;}
#b{width:200px;height:500px;border:2px solid blue;}
#c{width:500px;height:500px;border:2px solid green;position:relative;top:-480px;left:247px;}
#d{width:200px;height:500px;border:2px solid red;position:relative;top:-1005px;left:797px;}
#footer{width:1000px;height:200px;border:2px solid red;}
</style>
</head>
<body>
<div id="container">
<div id="b"><h2>Division_01</h2></div>
<div id="c"><h2>Division_02</h2></div>
<div id="d"><h2>Division_03</h2></div>
</div>
<div id="footer"><h2>This is my FOOTER....</h2></div>
</body>
</html>