响应式CSS溢出问题

我有一个响应式网站，不知何故有一个奇怪的溢出区域/问题不应该发生。这是需要一个真正的专家眼睛来找到问题，我很难过。响应式CSS溢出问题

html，body和body #wrapper宽度都是根据设备大小设置的，并且它们的overflow-x设置为隐藏，因此应该没有OVERFLOW区域，但它仍然作为棕色区域保留在右侧狭窄页面设计的一面。

在iOS中，它们以适当的缩放比例显示，但您可以向右滚动到棕色溢出区域。

在Android设备上，页面开始真正缩小并包含棕色溢出区域。

我不能为我的生活弄清楚是什么导致这个溢出区域，因为宽度和最大宽度被明确设置，并且overflow-x被设置为隐藏，因此任何东西都不应该超出页面容器。

该网站可以在http://gowestyoungmom.com/查看。

来源

2015-10-30 Joshua Jarman

改变你的CSS（responsive.css line 175）

@media only screen and (max-device-width: 360px) and (min-device-width: 331px) 
html, html body, body #wrapper 
{ 
    width: 330px !important; 
    min-width: 320px !important; 
    max-width: 360px !important; 
    overflow-x: hidden; 
}

，代之以这个

@media only screen and (max-device-width: 360px) and (min-device-width: 331px) 
html, html body, body #wrapper { 
    width: 100% !important; 
    min-width: 0 !important; 
    max-width: none !important; 
    overflow-x: hidden; 
}

来源

2015-10-30 03:34:03 Alex

@Joshua贾曼这个部分的我的解决方案可以帮助您？ – Alex

谢谢你的回复，这确实有一些帮助。溢出区域不再存在，因为它现在充满了物体。虽然它并没有解决整体问题。该页面现在仍然在Android和iOS上开始缩小。现在，窄列不在中间显示。所以现在iOS和Android都是错误的宽度。前进一步，后退两步。你可以看到这个位置的图像： http://redesigned.com/misc/GWYM_01.png （我想不出办法图像添加到评论...对不起）任何想法如何解决这个问题？ –

应用这些样式，并将这个'initial-scale = 1.0'添加到视口元。 – Alex

响应式CSS溢出问题

回答

相关问题