锚定元素给它的兄弟姐妹

Question

是否有可能使用HTML和＆amp; amp;仅限CSS？

+- #parent ------
| +-# elem1 ---
| | Varibale height (depends on content) - top anchored
| | to #parent (top: 0)
| |
| +------------
| +-# elem2 ---
| | Varibale height (depends on content) - top anchored
| | to #elem1 bottom and bottom #anchored to #elem3 top
| |
| +------------
| +-# elem3 ---
| | Fixed height - top anchored to #elem2 bottom and
| | bottom anchored to #parent bottom (bottom: 0)
| |
| +------------
+----------------

编辑：#parent元素高度可能是固定的，我正在寻找类似的东西：

http://doc.qt.nokia.com/qtquick-components-symbian-1.1/examples-native-scalability-anchors.html

http://doc.qt.nokia.com/qt-maemo/anchor-layout.html

Answer 1

我误解了，或者这就是你想要的 - http://jsfiddle.net/joplomacedo/rkKqy/ - ？

HTML

<div class="parent">
    <div class="child">varaible height child</div>
    <div class="child">varaible height child</div>
    <div class="child">fixed height child</div>
</div>​

CSS

.parent {
    position: relative;
    padding-bottom: 50px; //equal to last-child's height
}

.child:first-child {
    /*styles for the first-child here*/
}

.child:nth-child(2) {
    /*styles for the second-child here*/
}

.child:last-child {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px; //the fixed height
    /*anymore styles for the last-child here*/
}
​