3-3 实现左右布局


题目要求

左侧:宽度固定150px,高度自动撑开,和右侧同高

右侧:宽度自适应,高度自动撑开,和左侧同高

代码实现

    
body{
            margin: 0;
            padding: 0;
        }
        .container::after {
            
            height: 0;
            font-size: 0;
            height: 500px;
        }

        .left {
            width: 150px;
            height: 100%;
            float: left;
            background-color: red;
        }
        .right {
            width: calc(100vw - 150px);
            height: 100%;
            float: left;
            background-color: aqua;
        }