CSS适用于Chrome，但不适用于FF或IE

我在这个网站上有以下HTML/css简单代码www.habitacionalkids.com.ar在Chrome上没有问题，但是当我在FF或IE上打开它时，我有一个div缺失。我在其他网站上使用非常类似的代码，工作正常，但我不知道为什么不在这里工作。CSS适用于Chrome，但不适用于FF或IE

CSS

html, body, #wrapper, images { 
    height:100%; 
    width: 100%; 
    margin: 0px; 
    padding: 0px; 
    border: 0px; 
    background-color:#143d36; 
} 

img { 
    margin: 0px; 
    padding: 0px; 
    border: 0px; 
    display: block; 
    /*display: inline-block;*/ 
} 

.center { 
    width: 800px; 
    height: 600px; 
    position: absolute; 
    left: 50%; 
    margin-left: -400px; 
} 
.center_mini{ 
    margin: 0px; 
    padding: 0px; 
    border: 0px; 

} 
.center_mini_float{ 
    float:left; 
    margin: 0px; 
    padding: 0px; 
    border: 0px; 

}

HTML

<div class="center"> 
    <div class="center_mini"> 
     <img src="images/img_01.png" width="800" height="470" alt="bg"> 
    </div> 
    <div class="center_mini"> 
     <div class="center_mini_float"> 
     <img src="images/img_02.png" width="364" height="130" alt="bg"> 
     </div> 
     <div class="center_mini_float"> 
     <div class="center_mini"> 
      <div class="center_mini_float"> 
      <a href="https://www.facebook.com/HabitacionalKids?fref=ts" target="_blank"><img src="images/img_03.png" width="35" height="33" alt="bg"></a> 
      </div> 
      <div class="center_mini_float"> 
      <a href="mailto:[email protected]"><img src="images/img_04.png" width="34" height="33" alt="bg"></a> 
      </div> 
     </div> 
     <div class="center_mini"> 
      <img src="images/img_06.png" width="69" height="97" alt="bg"> 
     </div>    
     </div> 
     <div class="center_mini_float"> 
      <img src="images/img_05.png" width="367" height="130" alt="bg"> 
     </div> 
    </div> 
</div>

来源

2013-06-13 elunicotomas

看来，缺少DIV只是浮到其兄弟的右边，而不是在其下方。尝试添加此：

.center_mini { 
    clear: both; 
}

来源

2013-06-13 03:50:37 grc

用于Overflow:hidden;因为这样

.center_mini{overflow:hidden;}

和第二个选项是该

.center_mini:after { 
    clear: both; 
    content: ""; 
    display: table; 
    overflow: hidden; 
}

来源

2013-06-13 04:10:03

这将这样的伎俩为您服务。将这行代码添加到您的CSS。

.center_mini img{ 
     float:left; 
}

来源

2013-06-13 04:38:02 LegendaryAks

CSS适用于Chrome，但不适用于FF或IE

回答

相关问题