хотя пример хороший
т, я действительно запутался в некоторых основах абсолютного позиционирования.
<!DOCTYPE html>
<html>
<head>
<link href="http://yui.yahooapis.com/3.0.0/build/cssreset/reset-min.css" rel="stylesheet" type="text/css" />
<style>
#containingBlock {
position: relative;
background: green;
}
#abs {
position: absolute;
background: blue;
top: auto;
}
</style>
</head>
<body>
<div id="containingBlock">
<p>foo</p>
<div id="abs">bar</div>
</div>
</body>
</html>
С разметкой, расположенной, как указано выше, div # abs не перекрывает абзац foo.
Я знаю, что мог бы сделать это, задав top 0, а не auto, но так как div # СодержащийBlock не имеет заполнения, я подумал, что auto и 0 сделают то же самое.
Тем не менее, если параграф и div # abs переключаются в исходном порядке, чтобы make bar предшествовал foo -top: auto; работает именно так, как я ожидал.
Любые объяснения приветствуются!