css - 使用 CSS 的表格布局

Question

我试图在我的div中使用表格布局。我的配置一切正常。但是，设置最小宽度存在问题。我试图在表单中使用它。这是演示。

当divleft标签大小增加时，它不应该换行到下一行，直到 maindiv 宽度达到限制。所以这意味着将left div min-width设置为25％，如果left div内容增长，那么它应该扩展宽度以适应内容，直到它达到主div宽度。请建议我该怎么做。

CSS代码

.divmain
{
display: table-row;
padding: 12px;
}
.divleft
{
display: table-cell;
vertical-align: top;
padding: 1px;
width: 25%;
}
.divright
{
display: table-cell;
vertical-align: top;
padding: 1px;
}

Answer 1

添加两个属性

.divmain { width:100% }

.divleft { min-width: 25%; }

注意：我还更改了您的 CSS 声明：see the DEMO

更新

注意：您在更新的演示中错过divright了第一行的课程。现在看到

.divleft
{
    display: table-cell;
    vertical-align: top;
    padding: 1px;
    min-width: 35%;
}
.divright
{
    display: table-cell;
    vertical-align: top;
    padding: 1px;
}

更新了演示