两列布局，自适应宽度练习

<!--
两列布局一般是左右个区域div，外层有一个div，外层div居中，里面左右div分别占一定的宽度。

<meta charset="UTF-8">
<title>测试两列布局：左右，类似于splite</title>
<style type="text/css">
    body{
        margin: 0;
        padding: 0;
    }
    .main{
        width: 800px;
        margin: 0 auto;
    }
    .left{
        float: left;
        background: #ccc;
        width: 20%;
        height: 600px;
    }
    .right{
        float: right;
        background:#fcc;
        width: 80%;
        height: 600px;
    }
</style>