Question

我有一份html档案。

<div class="ads_list_admin">
{$dlt_msg}

    {foreach  name = fe1 item = k from = $all_ads}
        <div class="ads_i_admin">

            <div class="ads_own">
                {$k->ad_owner}
            </div>
            <div class="ads_plc">
                {$k->ad_place}
            </div>
            <div class="ads_own">
                <a href="{$path_site}{$index_file}?menu=rm_ads&cmd=rmads">
                    Delete
                </a>    
            </div>
        </div>  
    {/foreach}
</div>

而四舍五入为:

.ads_list_admin
{
    width:560px;
    padding:10px 12px 10px 15px;
    background:#cdc;
}
.ads_i_admin
{
    width:540px;
    clear:both;
    margin:10px;
    color:#666666;
    font-family:Arial;
    font-size:13px;
}
.ads_own
{
    width:120px;
    float:left;
    padding:8px 6px 8px 6px;
}
.ads_plc
{
    padding:8px 6px 8px 6px;
    width:220px;
    float:left;
}

但是,我的灰心并非全部。也就是说,四分五裂的背景并不完全显示。这里的问题是什么?

Answer 1

you need to clear floats, easiest way is to give the parent container overflow:hidden

更好的办法是使用这种明确的固定技术,将母集装箱放在<条码>cf上。班级:

/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}

.cf:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}

Answer 2

The problem is the float: left on your inner-most divs. Floated contents are ignored when calculating an element s height.

由于所有东西都是固定的,因此试图取代<条码>float:左、<条码>、<条码>、<条码>。这也可能是一种“科索沃”的情况,它更可取,甚至更可取,因为它认为这是一个表格数据。

友情链接