html - 表のセルのように並べて分割

Question

2 つの div を並べて配置し、1 つの div のみの幅を定義したいと考えています。

次に、他の div が親コンテナーに自動適合します。それ、どうやったら出来るの？

HTML:

<div class="parent">
    <div class="first"></div>
    <div class="last"></div>
</div>

CSS:

.parent {
    width: 100%;
}
.parent .first {
    width: 300px;
    float: left;
    background-color: red;
}
.parent .last {
    width: auto;
    float: right;
    background-color: blue;
}

ありがとう。

Answer 1

float2番目のdivをしないでください。最初のものだけを浮かせる必要があります。

http://jsfiddle.net/zLef8/

Answer 2

これを試してみてください

<div class="parent">
    <div class="first">test</div>
    <div class="last">test2</div>
</div>

CSS

.parent {
    width: 100%;
}
.parent > .first {
    width: 300px;
    float: left;
    background-color: red;
}
.parent > .last {
    width: auto;
    float: right;
    background-color: blue;
    text-align:left
}

例jsfiddle