如何使用CSS将具有相对位置的div高度设置为具有绝对位置的子div？

Question

父div高度应调整为子div高度，以使父级彼此不重叠。 怎么做？

http://jsbin.com/zeluke/edit?html,css，输出

Answer 1

我不确定这里要问什么，也就是说，父母和孩子的身高/宽度/位置不应该重叠吗？ 还是如示例中所示，孩子应该处于不同的位置？

首先，保持父div的相对位置并设置其宽度/高度。 这里没有高度/宽度的父div是无量纲的，看起来像重叠。 然后，第二，对于具有绝对位置的孩子，设置其身高/宽度/（左，右，上，下）属性。 position元素与（left，right，top，bottom）属性一起使用，这些属性的默认值为auto，浏览器集，并且对于两个孩子，您都可以将其设置为相同，即，相对于其父对象，孩子的位置相同。 这两个步骤将使孩子和父母处于自己的位置。 您也可以考虑为其添加边距/填充以在视觉效果上实现更多分离。

请记住，绝对位置是相对于最近定位的祖先的位置。 另外，请考虑使用（左，右，上，下）属性。