css如何使元素margin-bottom转到其容器的底部

Question

我需要一个元素的margin-bottom等于其容器的100%。

例如：http://jsfiddle.net/5hz4g/3/

我希望padding / margin（使用填充以便颜色可以说明）使to-bottom div与容器一样高并将所有内容推向右侧。

如果我有类似的东西，to-bottom的边距会到达页面底部。我希望它转到container的底部。我怎么能做到这一点？

Answer 1

请试试这个：

HTML：

<div class="container">
    <div class="to-bottom">
        this is always @ bottom of parent div
    </div>
</div>

CSS：

.container{
    position: relative;
    width: 50%;
    background-color: #eee;
    min-height: 200px;
}
.to-bottom{
    bottom:0px;
    position:absolute;
    width: 100%;
    background-color: #ccc;
    text-align: center;
}

请参见此处示例：http://jsfiddle.net/salota8550/3jPMk/

更新： 在与OP讨论后，他的需要是将两个div彼此相邻并具有相同的高度

基于此，我的回答是对以下内容的更新：

的 EXAMPLE HERE

HTML代码：

<div class="container">
    <div class="greenBox">
        This is GREEN Box
    </div>
    <div class="redBox">
        This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. This is RED Box.. 
    </div>
</div>

CSS代码：

.container{
    width: 100%;
    display: table;    
}
.greenBox{
    width: 25%;
    background-color: #a9e8a2;
    display: table-cell;
}
.redBox{
    width: 75%;
    background-color: #ec6446;
    display: table-cell;
}