是什么导致网站渲染差异？

Question

我试图制作我的项目原型（移动版留言板）。经过几个小时的html和CSS后，我决定检查它在Chrome中的外观（在我用它编写firefox响应式设计模式之前），一切都很顺利。

我无法弄清楚哪些css规则会导致它以这种方式呈现。为什么它只在FF响应设计模式下看起来很好。提前谢谢！

firefox screenshot

chrome screenshot

prototype link，所以你可以检查css

Answer 1

差异似乎是由缺少视口元标记引起的。

将此添加到您的头标记。

import csv
with open('data.csv', 'rb') as f:
    for line in csv.DictReader(f):
        if 20 <= int(line['Ref']) <= 24:
            print(line)

这告诉浏览器以设备宽度呈现页面，而不是尝试呈现网站的桌面版本并缩小以适合窗口中的所有内容。

Answer 2

删除“身高：155px;”成

.homepage-gallery__block {
    float: left;
    width: 48%;
    height: 155px;
    margin: 0 1% 10px;
}