我正在构建一个由50％宽度div和25％宽度div组成的流体站点，我遇到的问题是对齐，特别是Chrome。
我已在此处上传了代码： http://tekulated.com/test100/
.half { float: left; width: 50%; }
.quater { float: left; width: 25%; }
.half img, .quater img { width: 100%; display: block; }
如果您在 Firefox 中加载示例并调整浏览器大小，您会看到它完美无缺。在 Chrome 中，div会不成比例地增长，因此会产生很大的差距。
〜删除display: block可以解决问题，但是我遇到了图片填充问题。
答案 0 :(得分：0)
好的，那么正在发生的事情是，你的例子中的大红色框与它的行伙伴和边缘区域的边缘相比有点太大，然后将框推向右边，然后制作最后一个盒子换行到下一个（逻辑）行
我认为确保大红色图像的高度与较小的行高度成正比会有所帮助。这只是一个图像调整大小的问题。
希望有所帮助。