空div获取的iPad/iPhone（Safari浏览器）虚边界浏览器

我有一个包含一个空div与它梯度的页面，就像这样：空div获取的iPad/iPhone（Safari浏览器）虚边界浏览器

<div class="prodGradientArea"></div> 

.prodGradientArea { 
    background: -moz-linear-gradient(center bottom , #ECEAE9 0%, #E4E3E2 50%) repeat scroll 0 0 transparent; 
    display: inline-block; 
    float: left; 
    height: 10px; 
    width: 420px; 
}

这看起来在FF，IE，Chrome和辉煌Safari ...在电脑上。当在iPad或iPhone上的Safari中进行检查时，我会在div周围看到一个小小的边框。如果我在框中写入文本，或者如果我放大很多，但是如果我写入一个不间断的空白区域，则会将其删除。我甚至尝试将透明像素放入，但对虚构边界没有任何影响。也尝试设置边界= 0，但这当然不是问题（它不是一个真正的边界，只是一个视觉“功能”）。

所以删除它的唯一方法是添加纯文本。我想我可以添加一个点并用颜色或其他方式隐藏它，但这会破坏我的小心脏，从而造成如此丑陋的修复。

请帮忙！

珍妮

来源

2011-09-09 Jenny

我不认为你已经包含足够的代码。例如，该CSS只包含'-moz-linear-gradient'，WebKit变体在哪里？问题的[jsFiddle演示]（http://jsfiddle.net/）将会很有用。 – thirtydot

可以轮廓？尝试设置大纲：0;在你的CSS。我不是说这是一个答案，因为我从来没有使用过iPad，但它的默认值可能是1px？值得一击我猜！ – Joe

插入到您的index.php这个代码在<head> - 面积，以避免iOS的不良变焦解释假象：

<meta name="viewport" content="initial-scale=1, maximum-scale=1">

然后去你的CSS文件，并插入一个1px的负边际，以避免这种情况。在我的网站这是页脚div：

.unten { 
    margin-top: -1px; 
}

我希望这也能帮助你！

来源

2011-11-01 10:32:02 Severin

空div获取的iPad/iPhone（Safari浏览器）虚边界浏览器

回答

相关问题