css - 将 2 个 div 放在不同宽度的包装器中，而不固定第二个 div 的宽度

Question

我有我的 html 是这样的...

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

现在我的文件夹列表div 大小是 160px。现在我希望消息列表div 占据内容类的其余宽度，该宽度设置为 100%（内容的宽度）。我不想修复CSS中消息列表的宽度。我怎样才能做到这一点？

我在两个 div 中都添加了float:left属性。

score 1 · Accepted Answer

像这样写：

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

score 0 · Accepted Answer

请检查：

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>

2 回答 2