本文介绍了三种实现CSS双列布局的方法：浮动解法，包括float&margin-left和float&hidden；display：table解法，利用table-cell实现；以及flex布局，通过设置flex属性轻松搞定。每种方法的优缺点也进行了详细说明。
双列布局
左边一列固定，右边一列自动填满
浮动解法
float&margin-left
left：float：left 和固定宽度 width：300px
right：margin-left：300px
优缺点
- 旧浏览器一个浮动一个固定会有问题
- margin决定于width，没有解耦
- right中内容不能使用clear消除浮动，否则会打乱布局
<style>
#left,
#right {
height: 300px;
}
#left {
border: green solid 1px;
color: green;
width: 300px;
float: left;
}
#right {
border: hotpink solid 1px;
color: hotpink;
margin-left: 300px;
}
</style>
<body>
<div id="left">固定列：左边</div>
<div id=
最低0.47元/天 解锁文章
1894
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
