html - 相对位置时子 div 的动态高度

Question

Position这似乎是一个重复的问题，但不幸的是，当is时我没有找到这个简单场景的答案Relative。

我有一个带有两个子 div 的父 div：

<div id="content">
    <div id="content_rdivider">&nbsp;</div>
    <div id="content_right"></div>
</div>

父 div 和子 div 都有一个position:relative;

一个 Jsfiddle 示例在这里

所以我的问题几乎就像这个问题，但这里的立场不是绝对的。

如何使content_rdividerdiv 的高度与父 div 的高度相同？

Answer 1

尝试这个

http://jsfiddle.net/9c4MK/15/

CSS

#content {
    position: relative;
    background-color: #FFF;
    width: 975px;
    padding: 0px 0px 0px 0px;
    background-repeat: no-repeat;
    background-position: bottom left;
    border: solid 1px #d7d7d7;
    border-bottom: none;
    margin-left: auto;
    margin-right: auto;
    direction: ltr;
    overflow: hidden;
    height: auto;
    display: table;
}
#content_right {
    width: 180px;
    text-align: right;
    display: table-cell;
}
#content_rdivider {
    width: 10px;
    text-align: center;
    background-color: red;
    position: relative;
    height: 100%;
    display: table-cell;
}