iFrame仅在移动Safari浏览器中显示灰线

我设计了一个简单的企业网站，并且花费了更多时间来尝试调试此呈现问题，而不是让我的东西在PHP中正常工作！iFrame仅在移动Safari浏览器中显示灰线

我有一个iframe。在所有其他浏览器（甚至是桌面上的Safari）上，它都能正确呈现，但在Safari移动设备上，iFrame边框上有一条细灰线 - 但仅限于某些缩放级别。我阅读了其他类似的帖子，这些帖子与2个div相互联系，但是iFrame没有被封装在div中。

相关CSS：

iframe.noBorder { 
    border: none; 
    border:0; 
}

实际iframe嵌入代码：

<iframe class="noBorder1" src="header.html" width=980 height="160" frameborder="0" border="0" scrolling="no" ></iframe>

就像我说的，它不是一个div或任何东西。您可以看到问题here或检出image here。

我在几个PC浏览器上试过这个没有问题 - 所以我猜你已经发现了一个移动故障。

你可以设置border-color attribute of the iframe与包含元素相同的绿灰色 - 或者是透明的，看看是否修复了它？

2011-08-23 23:26:50 amelvin

感谢您的快速响应。是的，它只影响iPhone和iPad上的移动探险。它可以在所有桌面浏览器（包括Safari，IE，Chrome和Firefox）上正常运行。如果我将边框颜色设置为bg，那么右侧会显示淡绿色的线条，因为这与bg颜色不同。 –

@Vinod你可以尝试设置背景和边框颜色为'透明'吗？ – amelvin

我发现了一个黑客 - 没有真正为它感到骄傲。我只是拿了一个div，并使该div为bg颜色。我不得不使它大约5个像素左右 - 出于某种原因，1像素的div仍然出现。它解决了 - 但它是一种非常愚蠢的修复方式 - 我无法想象其他任何东西。我确实尝试将边框改为“透明”，但这也没有帮助。 –

overflow: hidden;解决了问题！

2012-06-28 22:36:28 JPguitar

回答