UED双飞翼布局

    <style>
        body,html {
            height:100%;
            padding: 0;
            margin: 0
        }
        
        .main {
            background: #f2f2f2;
            width: 100%;
            float: left;
            height: 100%;
        }
        .left {
            background: gray;
            width: 100px;
            float: left;
            margin-left: -100%;
            height: 100%;
            overflow: hidden;
        }
        .right {
            background: #fff;
            width: 100px;
            float: left;
            margin-left: -100px;
            height: 100%;
            overflow: hidden;
        }
        .inner {
            margin-left: 100px;
            margin-right: 100px;
        }
    </style>
  </head>
  <body>
          <div class="main">
            <div class="inner">
                Main
            </div>
        </div>
        <div class="left">Left</div>
        <div class="right">Right</div>
  </body>

 

/**
 *                    _ooOoo_
 *                   o8888888o
 *                   88" . "88
 *                   (| -_- |)
 *                    O\ = /O
 *                ____/`---'\____
 *              .   ' \\| |// `.
 *               / \\||| : |||// \
 *             / _||||| -:- |||||- \
 *               | | \\\ - /// | |
 *             | \_| ''\---/'' | |
 *              \ .-\__ `-` ___/-. /
 *           ___`. .' /--.--\ `. . __
 *        ."" '< `.___\_<|>_/___.' >'"".
 *       | | : `- \`.;`\ _ /`;.`/ - ` : | |
 *         \ \ `-. \_ __\ /__ _/ .-` / /
 * ======`-.____`-.___\_____/___.-`____.-'======
 *                    `=---='
 *
 * .............................................
 *          佛祖保佑             永无BUG
 */

 

posted @ 2016-12-09 13:55  杜培东  阅读(182)  评论(0)    收藏  举报