flex布局
<div class="row">
<div class="col">主要內(nèi)容區(qū)域主要內(nèi)容區(qū)域主要內(nèi)容區(qū)域</div>
<div class="col">側(cè)邊欄側(cè)邊欄</div>
<div class="col">側(cè)邊欄側(cè)邊欄</div>
</div>
.row {
display: flex;
}
.col {
flex: 1;
border:solid;
background:red;
}
table
<div class="container">
<div class="mainBox">主要內(nèi)容區(qū)域</div>
<div class="sideBox">側(cè)邊欄側(cè)邊欄側(cè)邊欄側(cè)邊欄側(cè)邊</div>
<div class="sideBox">側(cè)邊欄側(cè)邊欄側(cè)邊欄側(cè)邊欄側(cè)邊</div>
</div>
.container{
display: table-row;
background:yellow;
}
.mainBox{
display: table-cell;
width: 80%;
}
.sideBox{
display: table-cell;
width: 20%;
background: red;
}