我有以下情况，我需要一些帮助...
您可以在此处查看结果：http://www.thoughtartistry.com
有什么想法吗？
答案 0 :(得分：21)
我在最近的一个项目中遇到了类似的问题，我在其中使用了具有不同背景颜色的背景图像蒙版来为移动Safari中的结果图标着色。问题是当页面被Safari按比例缩小时，图像周围会出现一条背景颜色，即使它应该被屏蔽。当页面缩小时，我从未找到防止背景颜色泄漏的方法。在移动Safari的算法中，重新计算背景和掩码显然是错误的。我确实找到了一个解决方法：我在元素上添加了一个轮廓，其颜色与元素父元素的背景颜色相同。轮廓位于元素之外，因此掩盖部分渗出。如果你的元素的父元素具有激烈的图案背景，那么效果不会很好，但如果它是纯色的话，它就会很好。
答案 1 :(得分：5)
负边距是我发现阻止这种情况的唯一方法。
例如，如果2个div之间有一个微弱的水平间隙，则向第二个div添加-1px的上边距将使其略微重叠，并且在页面缩放时间隙不会再出现。
某些情况（如图像精灵或重复模式）可能需要稍微调整一下，但总的想法是一样的。对于精灵，请确保裁剪边框的1个像素内没有大的颜色变化。出血量不超过1个像素，因此1像素的调整就足够了。
答案 2 :(得分：3)
问题不仅在于div匹配在一起，还与图像精灵有关。
我遵循了将初始视口比例设置为1.0的建议。子像素错误消失了，但后来我在其他设备（如Android）上测试了我的网站，并意识到全尺寸页面很烦人，因为用户每次加载都必须重新缩放。所以我更喜欢禁用比例并等到Apple修复它。然后有一天我在思考如何用页面的边距解决问题，我在CSS中找到了这个简单的解决方案：
html {
min-width: 1024px;
}
具有此分辨率的设备（例如iPad处于水平位置）会将文档比例设置为1.0。在我的情况下，这是足够的解决方案，因为我可以显示页面正常工作，并且子像素错误在Safari / iOS中，这将在未来有希望解决。
答案 3 :(得分：2)
这完全取决于某种情况，但在我们的情况下，我们使用此线程建议的负边距或框阴影，因为outline仅适用于所有边界，即。 outline-bottom不存在。
/*
* Prevent faint lines between elements.
* @link http://stackoverflow.com/questions/5832869
*/
box-shadow: 0 1px 0 red;
答案 4 :(得分：1)
我还使用overflow-x：hidden解决了iOS子像素间隙问题（在全屏网站上）;停止横向滚动＆amp;视点比例停止音高变焦。我也有持有者divs设置宽度：101％;并且所有元素/图像div都设置为float：left;。这意味着子像素间隙全部位于左侧位置，但被设置为101％宽度的支架div推出视野。
答案 5 :(得分：0)
我尝试使用meta / viewport选项，特别是将初始比例设置为1.0并禁用用户缩放。
答案 6 :(得分：0)
从差距之下的div中删除“clear：both”（如果有）。
答案 7 :(得分：0)
我也必须解决这个问题。如果您仅使用Div来定义部分。
//background.css
.background-color {
background-color: blue;
}
.background-color div {
background-color: inherit;
}