css - 残りの幅をフローティング div で埋めるにはどうすればよいですか?

Question

を持つ div と を持つfloat: leftdiv がありますfloat: right。を持つ divfloat: leftの幅は ですが50px、 を持つ divfloat: rightは親 div の残りの水平スペースを占有する必要があります。

CSSでこれを実現するにはどうすればよいですか?

Answer 1

margin-left:60px右のdivを使用せずに（または左のdivの幅を）使用してみてくださいfloat。ここで関連するフィドルを参照してください: http://jsfiddle.net/CKcQH/

CSS:

.leftDiv
{
    width:50px;
    float:left;
    border:1px solid red;
}
.rightDiv
{
    margin-left:55px; /* Compute total width of leftDiv */
    border:1px solid blue;
}

HTML:

<div>
    <div class="leftDiv">
        My content on left
    </div>
    <div class="rightDiv">
        My content on right should take all the space the parent has (after excluding the space on the left)
    </div>
</div>