div布局解决办法

2013-10-21

div布局本帖最后由 jojosnail 于 2013-09-26 11:26:30 编辑帮忙看看，要上中下布局，中间又分左中右，但是执

div布局
本帖最后由 jojosnail 于 2013-09-26 11:26:30 编辑帮忙看看，要上中下布局，中间又分左中右，但是执行出来中间的跑最底下了，什么问题呢
<html>
<head>
    <style type="text/css">
        .div_head
        {
            width: 100%;
            background-color: #E0ECFF;
            color: #0E2D5F;
            padding-left: 5px;
            padding-top: 5px;
            padding-bottom: 5px;
        }
        .div_foot
        {
            width: 100%;
            margin-top: 20px;
            text-align: center;
            background-color: #F4F4F4;
            padding-top: 5px;
            padding-bottom: 5px;
        }
        .div_lr_l
        {
            float: left;
            width: 48%;
        }
        .div_lr_r
        {
            float: right;
            width: 48%;
        }
        #div_c_c
        {
            float: left;
            width: 4%;
            text-align: center;
            vertical-align: middle;
            padding-top: 50px;
        }
    </style>
</head>
<body>
    <div class="div_head">
        top
    </div>
    <div style="width: 100%">
        <div class="div_lr_l">
            left
        </div>
        <div id="div_c_c">
            center
        </div>
        <div class="div_lr_r">
            right
        </div>
    </div>
    <div class="div_foot">
        bottom
    </div>
</body>
</html>
div布局
[解决办法]

<div class="div_head">
        top
    </div>
    <div style="width: 100%">
        <div class="div_lr_l">
            left
        </div>
        <div id="div_c_c">
            center
        </div>
        <div class="div_lr_r">
            right
        </div>
        <div style="clear:both;"></div><!--清除飘浮--> 
 
    </div>
    <div class="div_foot">
        bottom
    </div>

加这句就行了

热点排行

asp.net

div布局解决办法