股利不显示全高

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> 

而对于DIV的CSS是：

.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; 
} 

但我的DIV高度不充分。这意味着div的背景颜色没有完全显示。这里有什么问题？

Answer 1

需要清除花车，最简单的办法是给父容器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

问题是float: left在你最内层的div上。计算元素的高度时会忽略浮动内容。

因为无论如何一切都是固定宽度，请尝试用display: inline-block替换float: left。这也可能是“确定”的情况 - 最好甚至是 - 使用表格，因为它看起来像表格数据。