flex布局
<div class="row">
<div class="col">主要内容区域主要内容区域主要内容区域</div>
<div class="col">侧边栏侧边栏</div>
<div class="col">侧边栏侧边栏</div>
</div>
.row {
display: flex;
}
.col {
flex: 1;
border:solid;
background:red;
}
table
<div class="container">
<div class="mainBox">主要内容区域</div>
<div class="sideBox">侧边栏侧边栏侧边栏侧边栏侧边</div>
<div class="sideBox">侧边栏侧边栏侧边栏侧边栏侧边</div>
</div>
.container{
display: table-row;
background:yellow;
}
.mainBox{
display: table-cell;
width: 80%;
}
.sideBox{
display: table-cell;
width: 20%;
background: red;
}