元素比窗口宽 - CSS

Question

当我在智能手机(iPhone)或MacBook上使用Safari浏览器检查我的网站时,我网站的某些元素比浏览器窗口更宽,例如body-tag.我用dev-tool检查了网站,似乎它的宽度为600px,位于下方.我在Chrome中没有看到这个问题.

您可以在此处看到屏幕截图,并看到窗口的宽度为375px,但body-tag 的宽度为439px .

我正在应用这个CSS规则,因为我读到这应该解决问题但不幸的是它不适合我.

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

这是我正在谈论的网站:http://www.firma-info.no

我希望有人对我有建议.

提前致谢!

Answer 1

我正在响应视图中的桌面上的Firefox上进行测试

但是,我发现背景中有云.x1, .x2 etc.导致窗口宽度大于预期.当云在他们的动画结束时就是这种情况.

简overflow: hidden;于#page做这项工作.

我不知道这是否确实导致了您的问题,但无论如何它可能会有所帮助.

此外,我建议使用变换translate来移动云,而不是在动画中移动边距.