左侧固定右侧宽度自适应

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无标题文档</title>
    <style type="text/css">
        * {
            padding: 0px;
            margin: 0px;
        }

        body {
            color: #FFF;
            font-size: 24px;
            text-align: center;
        }

        .left {
            width: 120px;
            height: auto !important;
            height: auto;
            min-height: 300px;
            float: left;
            background: #F00;
        }

        .right {
            width: 100%;
            height: 300px;
            background: #36F;
        }

        .container {
        }

        .foot {
            width: 100%;
            height: 30px;
            background: #000;
        }
    </style>
</head>

<body>
<div class="container">
    <div class="left">
        左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>左<br/>
    </div>
    <div class="right">右</div>
    <div style="clear:both"></div>
</div>
<div class="foot">footer</div>
</body>
</html>

相关阅读:
cloudera cdh4 hue 安装
设计模式Observer(观察者模式)
编译android源码三（编译系统）
centos 6.3 修改默认的系统语言
Linux下查看文件和文件夹大小的df和du命令
编译android源码二(下载源代码)
devenv.exe
Javascript和xml合用
DataKeys的用法
XSL(转)

原文地址：https://www.cnblogs.com/ganler1988/p/3197581.html

左侧固定 右侧宽度自适应

左侧固定右侧宽度自适应