为什么绝对定位元素嵌套在第一个“行”相对 div 而不是其父 div 中？答案

【问题标题】：Why does absolute positioned element nest in first "row" relative div instead of its parent div?为什么绝对定位元素嵌套在第一个“行”相对 div 而不是其父 div 中？
【发布时间】：2012-07-03 17:03:34
【问题描述】：

我想要达到的目标：

两加行，每行包含三列。对于行，我指定了相对定位，每行包含三个图像，两行。这工作正常。

我想在这些图像下方使用分层 div，使用绝对位置和负 z-index，这对于第一行也适用。第二行，图像排列良好，但绝对定位的 div 出现在第一行。

jsFiddle 在这里： http://jsfiddle.net/Ajdin/tNGCM/

我在板上阅读了一些问题，并在谷歌上搜索了 css 绝对定位，因为我认为我可能会误解某些东西。请帮忙:)

【问题讨论】：

标签： css html containers css-position

【解决方案1】：

由于 div ".hireBioImg" 设置了 "float" 属性，它不会将高度扩展到其父级。所以在hireBioRow中，你需要添加“clearfix”来包裹浮动元素。

请在此处查看更新： http://jsfiddle.net/tNGCM/1/

关于 clearfix 的更多信息：

当浮动元素位于容器框内时会出现问题，该元素不会自动强制容器的高度调整为浮动元素。当一个元素浮动时，其父元素不再包含它，因为浮动已从流中移除。

http://www.webtoolkit.info/css-clearfix.html

【讨论】：

谢谢，您的解决方案有效。在阅读了问题的原因后，我为解决问题的行指定了一个设置高度。