html - 固定将 Div 的顶部定位到父 div 的底部

Question

我有一个关于定位 div 的有趣问题。

我正在使用相对绝对定位将子 div b 定位在父 div a 内。我知道如何使用 bottom:0px 将它们的底部边缘对齐，但我需要它们的位置以使 B 的顶部与 A 的底部对齐，如下图所示。

鉴于我不能确定 B 的高度，在 CSS 中有什么方法可以做到这一点。我当前的 CSS 在下面。

目标 -

HTML -

<div id="a">
     <div id="b"> </div>
</div> 

CSS -

#a{
   position: relative;
}

#b{
   position: absolute;
   bottom:0px;
}

Answer 1

我想你在追求 top: 100%: http://jsfiddle.net/ysafx/

#a {
    position: relative;
    outline: 1px solid red
}

#b {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 5px;
    outline: 1px solid blue
}