绝对定位与相对儿童相同的高度

Question

我的网站上有一个渐变作为背景。 .main div绝对定位。我希望它与其中的内容具有相同的高度，但我怎样才能实现呢？

Answer 1

绝对没有你的main / container / wrapper div绝对定位。是定位相对。

 <div class = "main">

    <div class = "content">....</div>

 </div>

然后你有你的CSS：

.main {
  position: relative;
  margin: 0 auto;
}

.content {
  height: 100%;
}

看看这个jFiddle：http://jsfiddle.net/persianturtle/3eJGr/

可以找到一篇关于绝对定位真正做法的精彩文章here

细分：

  

完全从文档中删除绝对定位的元素   流。这意味着它们对其父元素或根本没有任何影响   关于它们在源代码中出现的元素。一个   绝对定位元素因此将与其他内容重叠   除非你采取行动阻止它。

Answer 2

如果绝对定位div内的元素位于相对位置且具有宽度和高度，则可以将此css应用于.main div：

height:auto;

这将根据

中所有内容的高度计算高度