我在http://eiglaw.com上遇到了一个问题--在iPhone的屏幕右侧显示了一个大约25px宽的空白/边框。我研究了stackoverflow上的问题,这些帖子是相关的,但当我尝试提供的各种解决方案时,我都无法修复该问题:
iPhone上的响应式网站-从景观到肖像旋转时不需要的空白
在iPhone Safari中呈现右白色边距的网站正文背景
缩放时页眉右侧有空白
我在iPad上也遇到过类似的问题,但可以通过以下媒体查询来修复它:
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
/*and (orientation : landscape)*/ {
html,
body {
width:1000px;
}
}
我尝试了各种针对html和body元素的媒体查询,但没有成功。我已经查看了整个CSS文件的背景图像,边距,填充,溢出等问题,但真的被难住了。有人有什么建议吗?
多谢!
问题出在您的
(为什么是h3,顺便说一句?)上,由于widty:100%
+一些填充,该菜单似乎比视口要宽。
尝试为该元素设置box-sizing:border-box;
。
这对Tigran很管用。
我刚刚在样式表的顶部添加了一个全局类:
null
div {
box-sizing: border-box;
}