css - float 并对齐到元素的底部

Question

如何同时对齐:float:right 元素 B & C 紧挨着 element A，并且 align element B 到 element A 的底部，element C 到顶部:

当我将 float 添加到 elements B & C 时，这两个元素与 element A 的顶部对齐，我想要的如下图所示:

PS:元素 A 没有固定大小。

Answer 1

我不认为这可以用花车来完成。我会尝试将 div C 和 B 嵌套在 A 中，然后将它们相对于 A 绝对定位。

所以像这样:

HTML

<div class="a">a
    <div class="b">b</div>
    <div class="c">c</div>
</div>

CSS

.a {
    margin-left: 60px;
    position: relative;
}
.b, .c {
    position: absolute;
    left: -60px;
}
.b {
     bottom: 0;
}
.c {
     top: 0;
}

参见 jsfiddle示例。