移动设备中的chrome和firefox的css不同

Question

我正在使用wordpress悉尼主题，我正在尝试创建一个响应式网站，我意识到它在不同的浏览器上显示不同的CSS。

这是一个例子：chrome firefox：

当我尝试检查响应性时，再次使用chrome：

这是在不同的计算机上使用chrome [*]这是它应该在任何地方看起来像：

这边是边缘：

我不确定是什么导致这种情况发生，该网站是haagsehof.nl。

我为这样的不同设备制作了一些自定义css用于响应：

@media (min-width:767px){
}

@media (max-width:766px) and (min-width:400px) {
}

@media only screen and (max-width: 399px) {
}

如何让不同设备中的所有浏览器都使用相同的css格式，以便网站在每个平台上看起来都一样？

Answer 1

我不知道在wordpress中进行此操作，但一般情况下适用以下内容。

您必须为在特定浏览器中不起作用的所有内容添加代码。所以你可能不得不使用-moz-或-webkit-而不仅仅是添加代码。浏览器有不同的默认值，有时甚至需要前缀，这很烦人。

Answer 2

除了@RenéSteeman所说的，一些Wordpress主题不允许您访问CSS文件。我会检查并确保你能够先做到这一点，否则选择一个不同的主题可能是最简单的方法来解决这个问题。如果你可以访问CSS Rene是对的。您可以更改每个浏览器的外观。最后，您可能想要参考此列表：https://www.w3schools.com/cssref/css3_browsersupport.asp。并非所有CSS功能都可以在每个浏览器上使用。除此之外，您的浏览器也可能需要更新。祝你好运！