<div class="container">
<!-- 新增一个 div 把 .center 包裹起来 -->
<div class="center-container">
<div class="center">center</div>
</div>
<div class="left">left</div>
<div class="right">left</div>
</div>
body {
min-width: 630px;
}
.container {
overflow: hidden;
}
.center-container {
width: 100%;
float: left;
}
.center-container .center {
height: 150px;
background-color: #94e8ff;
margin-left: 100px; /* 新添加的属性 */
margin-right: 200px; /* 新添加的属性 */
}
.left {
width: 100px;
height: 150px;
background-color: #ffb5bf;
float: left;
margin-left: -100%;
}
.right {
width: 200px;
height: 150px;
background-color: #8990d5;
float: left;
margin-left: -200px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.