可以使用CSS清除绝对定位的元素吗?

Sta*_*erg 11 html css css-position clear

有没有办法用CSS清除绝对定位的元素?我正在创建一个页面,我需要网站的每个部分(部分元素)绝对定位,并且我想应用一个内容低于这些元素的页脚.
试图相对定位页眉和页脚,看看是否会考虑总高度,但页脚仍被"困"在截面元素下面.有任何想法吗?

<header style="position: relative;"></header>

<div id="content" style="position: relative;">

    <section id="a" style="position: absolute;"></section>

    <section id="b" style="position: absolute;"></section>

    <section id="c" style="position: absolute;"></section>

    <section id="d" style="position: absolute;"></section>

    <section id="e" style="position: absolute;"></section>

</div>

<footer style="position: relative;"></footer>
Run Code Online (Sandbox Code Playgroud)

Dio*_*ane 19

绝对定位的元素不再是布局的一部分 - 父项不知道绝对定位的子元素有多大.您需要自己设置"内容"的高度,以确保它不与页脚重叠.


Lex*_*nko 6

不要在布局中使用绝对定位的元素,因为这些元素会从正常流中移除并且不再影响它们周围的元素。而且它们不受其他元素的影响。

当条件允许时,使用绝对定位来移动容器内的元素。

对于浮动元素,我建议您使用称为 clearfix 的特定清除技术。我虔诚地使用它。

http://nicolasgallagher.com/micro-clearfix-hack/

http://jsfiddle.net/necolas/K538S/