1.左侧宽度固定左浮动,右侧设置margin-left为左侧宽度;
.box1 {
width: 200px;
height: 500px;
background: #ff0;
float: left;
}
.box2 {
height: 500px;
background: #f00;
margin-left: 200px;
}
2.父级设置display:flex,左侧宽度固定,右侧flex为1;
.box {
display: flex;
}
.box1 {
width: 200px;
height: 500px;
background: #ff0;
}
.box2 {
height: 500px;
background: #f00;
flex: 1;
}
3.左侧固定宽度并绝对定位脱离文档流,右侧设置margin-left;
.box1 {
width: 200px;
height: 500px;
background: #ff0;
position: absolute;
}
.box2 {
height: 500px;
background: #f00;
margin-left: 200px;
}
4.左侧宽度固定且左浮动,右侧overflow:hidden;
.box1 {
width: 200px;
height: 500px;
background: #ff0;
float: left;
}
.box2 {
height: 500px;
background: #f00;
overflow: hidden;
}