阿里2016前端开发工程师笔试 - 布局之左侧自动宽度右侧固定宽度

来源：互联网发布：淘宝上最好卖的是什么编辑：程序博客网时间：2024/05/17 23:20

<div class="demo">    <div class="container">        <div class="content">            <div class="content_left">左侧响应区子层1</div>            <div class="content_right">左侧响应区子层2</div>        </div>    </div>    <div class="side">右侧固定区</div></div>

<style>    .demo{        width:100%;        height:500px;    }    .container{        float: left;        width:100%;        height:100%;        margin-right:-300px;    }    .side{        float: right;        width:300px;        height:100%;        background-color: #000;    }    .container .content{        height:100%;        margin-right: 300px;    }    .container .content .content_left{        float: left;        width:49.99%;        height:100%;        background-color: #f60;    }    .container .content .content_right{        float: right;        width:49.99%;        height:100%;        background-color: #f90;    }</style>

0 0