设计场景
老式解决方案
<div class="col-md-resize">
<div class="col-md-side"></div>
<div class="col-md-main"></div>
</div>
.col-md-resize {
position: relative;
padding-left: 220px;
}
.col-md-side {
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
width: 200px;
border: 1px solid #e5e5e5;
}
.col-md-main {
border: 1px solid #e5e5e5;
}
新式解决方案
<div class="col-md-resize">
<div class="col-md-side"></div>
<div class="col-md-main"></div>
</div>
.col-md-resize {
display: flex;
}
.col-md-side {
width: 200px;
margin-right: 20px;
}
.col-md-main {
flex: 1;
}
