多栏自适应布局

<!--html代码-->
    <div class="right"></div>
    <div class="left"></div>

* {
    margin: 0;
    padding: 0;

}
/*方案一*/
.right {
    width: 200px;
    height: 200px;
    background-color: orange;
    float: right;
}

.left {
    height: 200px;
    background-color: lawngreen;
    margin-right: 200px;
}
/*方案二*/
.right {
    width: 200px;
    height: 200px;
    background-color: orange;
    position: absolute;
    right: 0;
}
.left {
    height: 200px;
    background-color: lawngreen;
    margin-right: 200px;
}

 <!--html代码-->
    <div class="right"></div>
    <div class="left"></div>
    <div class="center"></div>

.right, .left, .center {
    height: 200px;
}
.right, .left {
    width: 200px;
    position: absolute;
}
.right {
    right: 0;
    background-color: red;
}
.left {
    left: 0;
    background-color: green;
}
.center {
    background-color: #000;
    margin-left: 200px;
    margin-right: 200px;
}