移动Safari中的线条工件 [英] Line artifacts in mobile Safari

问题描述

Safari会在我的网站上以某种比例呈现div之间的黑线。当它分割出一个按钮或其他两个不同div中的图像时，它会特别糟糕。我不能把BG放在两个div的父母中，因为它们是透明的.pngs。任何解决方案或只是处理它？<​​/ p>

捕获问题， http://i.stack.imgur.com/pTLki.png

TravisO也有同样的问题，我改变了方法页面布局了，原来它是一个有5行的简单表，我删除了行，只是用图像和br，仍然发生。我试图通过CSS删除所有填充和边距，但很明显问题不在于浏览器渲染，而是通过重新采样浏览器将页面转换为适合屏幕的大小。您可以在以下位置查看我的损坏页面：

http：/ /www.apinkdoor.com/show/

解决方案

此问题是移动设备产生舍入错误的结果safari当它重新缩放背景图像以供显示时（这是一个错误： http://openradar.appspot.com/8684766）。

解决方案是将左侧右侧边缘的宽度增加1或2px。然后相应地调整CSS，以便默认情况下不会显示您添加的1或2个像素。

Safari renders black lines in between divs on my website at some scales. It is particularly bad when it breaks apart an image that is chopped in two different divs for a button or something. I can't put a BG in the parent of the two divs because they are transparent .pngs. Any solution or just deal with it?

capture of the problem, http://i.stack.imgur.com/pTLki.png

TravisO also has the same problem, and I changed how the page was laid out, originally it was a simple table with 5 rows, I removed the rows and just went with images and br, still happens. I've tried to remove all padding and margins via CSS but it was pretty obvious the problem isn't the browser rendering, but with the resampling the browser does to convert the page into a size that fits on the screen. You can see my broken page at:

http://www.apinkdoor.com/show/

解决方案

This issue is a result of a rounding error produced in mobile safari when it rescales background images for display (it's a bug: http://openradar.appspot.com/8684766).

The solution is to increase the width of your right-button edge on its left side by 1 or 2px. Then adjust your CSS accordingly so the 1 or 2 pixels you added are not displayed by default.

这篇关于移动Safari中的线条工件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！