实现左侧固定右侧自适应的两列布局显示效果

<style>
        *{
            padding:0;
            margin:0;
        }
        .left-menu,
        .content{
            position:fixed;
            top:0;
            left:200px;
            width:100%;
            height:100%;
            background:red;
            color:#fff;
        }
        .left-menu{
            width:200px;
            left:0;
            background:green;
        }
 </style>   
 <div class="wrapper">
        <div class="left-menu">
            左侧菜单栏
        </div>
        <div class="content">
            右侧自适应
        </div>
    </div>

<style>
   *{padding:0;margin:0;}
   .left-menu{width:200px;float:left;background:red;height:50px;}
   .content{width:100%;height:50px;background:green}
</style>
 <div class="wrapper">
    <div class="left-menu">
       左侧菜单栏
    </div>
    <div class="content">
       右侧自适应
    </div>
</div>

<style>
   *{padding:0;margin:0;}
   .left-menu{width:200px;float:left;background:red;height:50px;}
   .content{width:100%;height:50px;background:green;float:right;margin-right:-200px}
</style>
 <div class="wrapper">
    <div class="left-menu">
       左侧菜单栏
    </div>
    <div class="content">
       右侧自适应
    </div>
</div>