具有绝对孩子的多个div的自动高度？

Question

我正在开发一个类似“卡片”的界面，每个“卡片”（相对位置的矩形 div）都有多个绝对定位的子元素，并且像这样在同一页面上有多个 div。

我花了几个小时寻找解决方案，但没有成功。从我读过的内容来看，不可能在具有绝对子级的 div 上使用 CSS 进行自动高度。我也偶然发现了jQuery example，但我不知道如何操纵它来处理多个 div。我还尝试了清除修复和操纵溢出。

我一直在处理的页面 (http://q.glorbi.com/profile.php) 运行良好，看起来不错，但每个 div 的高度限制为 300 像素，根据其内容可能太小或太多。

有谁知道如何调整具有绝对孩子的多个父母的大小？任何解决方案都可以，即使它依赖于 jQuery 等！

谢谢！

Answer 1

你的每张卡片都是这样的

<div class="box">
  <div id="askerdp"></div>
  <div class="question">Are you awesome?</div>
  <div class="answer">I am the awesomest human being alive.</div>
</div>

使用 .box 相对和内部 div 绝对。鉴于每张卡片的简单结构，你为什么不这样做呢

<div class="box">
  <div class="container">
    <div id="askerdp"></div>
    <div class="question">Are you awesome?</div>
  </div>
  <div class="answer">I am the awesomest human being alive.</div>
</div>

并使.container 相对，#askerdp 绝对，以及其他所有内容都是静态的。这应该可以解决您的自动高度问题，并且看起来仍然和现在一样。