我在网上搜索过，似乎找不到一个干净、简单、所有浏览器友好的三栏布局。
我希望有 3 列布局，左列固定为 200px，右列固定为 200px，中间列保留剩余宽度，但最小宽度为 600px。所以整体最小宽度是 200px + 600px + 200px = 1000px。
我见过很多例子，在调整浏览器大小时，列似乎彼此重叠，这是一个问题。
Thanks
如果源顺序并不重要，那么一种简单的解决方案是使用显示表格/表格单元格。使包装纸宽度为 100%，并具有所需的最小宽度。指定固定宽度列的宽度。使用表格显示时，所有列都将具有相同的高度。
#wrapper {
display: table;
width: 100%;
min-width: 1000px;
min-height: 400px;
}
#column-1 {
display: table-cell;
background: #DDF;
width: 200px;
}
#column-2 {
display: table-cell;
background: #EEE;
}
#column-3 {
display: table-cell;
background: #DDF;
width: 200px;
}
<div id="wrapper">
<div id="column-1">= 200px</div>
<div id="column-2">>= 600px</div>
<div id="column-3">= 200px</div>
</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
