css - 2 番目の div の幅を固定せずに、幅の異なるラッパー内に 2 つの div を配置する

Question

私はこのようなhtmlを持っています...

<div class = "content">
    <div class = "folder-list">
    </div>
    <div class = "message-list">
    </div>
</div>

これで、フォルダー リストのdiv サイズは 160px になりました。ここで、メッセージ リストのdiv が 100% (コンテンツの幅) に設定されているコンテンツ クラスの残りの幅を取るようにします。CSSでmessage-listの幅を固定したくありません。どうすればそれを達成できますか？

float:leftプロパティを両方の div に追加しました。

Answer 1

次のように書きます。

.folder-list{
 width:160px;
 float:left;
}
.message-list{
 overflow:hidden;
}

これをチェックしてくださいhttp://jsfiddle.net/BB9w6/

Answer 2

これを確認してください：

cssコード：

.folder-list{
    width: 160px;
    background:orange;
    float:left;
}
.message-list{
    width:100%;
    background:yellow;
}

htmlコード：

<div class = "content">
    <div class = "folder-list">
    Test1
    </div>
    <div class = "message-list">
    Test2

    </div>
</div>