css - div css 修复 100% 浮动 div 总和

Question

如何解决使 IE 丢弃最后一个 div 的问题？

<div>
 <div style="float:left; width:25%;"></div>
 <div style="float:left; width:50%;"></div>
 <div style="float:left; width:25%;"></div>
</div>

这应该是正确的，但是在较旧的 IE 上，它会使最后一个 div 换行

Answer 1

在您的样式表中设置下面的 css

div{
    margin:0;
    padding:0;
}  

默认情况下，它有一些填充和边距，需要重置为 0。

Answer 2

尝试这个：

<div style="float:left; width: 100%;">
  <div style="float:left; width:25%;"></div>
  <div style="float:left; width:50%;"></div>
  <div style="float:left; width:25%;"></div>
</div>

Answer 3

<div style="padding:0;margin:0;">
 <div style="float:left;height:200px; width:25%;background:blue;">text</div>
 <div style="float:left;height:200px; width:50%;background:yellow;">text</div>
 <div style="float:left;height:200px; width:25%;background:green;">text</div>
</div>

这是演示http://jsfiddle.net/XabvC/

你确定你的浏览器缩放值。它应该是 100%。如果你使用 IE 10，你应该在开发者工具中设置浏览器模式和文档模式 (F12)

Answer 4

可能有一个空间以折叠形式显示尝试

<div  style="font-size:0px">
 <div style="float:left; width:25%;"></div>
 <div style="float:left; width:50%;"></div>
 <div style="float:left; width:25%;"></div>
</div>