線性梯度工件

我有線性梯度問題在Mozilla Firefox 16. firefox linear-gradient artifact 線性梯度工件

在screenshow壞事是可見的（壞 - 在塊底部光線）。

代碼：

<a href="#">Button Text</a>

和CSS部分：

a { 
    background: -moz-linear-gradient(center top , #88EB52, #3CA82D); 
    border: 1px solid #399A29; 
    border-radius: 4px 4px 4px 4px; 
    color: #FFFFFF; 
    display: block; 
    float: left; 
    font-size: 16px; 
    font-weight: bold; 
    line-height: 54px; 
    margin-bottom: 20px; 
    margin-top: 20px; 
    text-align: center; 
    text-decoration: none; 
    width: 376px; 
}

我的截圖改變line-height屬性。

任何人都可以描述它是什麼線，以及如何隱藏它？

謝謝。對不起我的英語不好。

來源

2012-11-01 Umnyjcom

你可以做一個小提琴？作爲目前的樣式給出我沒有看到這樣的東西 –

在FF16中測試並按預期工作。也許如果您在問題出現時提供線高度值，我們可以跟蹤錯誤。我懷疑這是由於寬高比，如果問題發生。

這不是一個缺陷，但出於一致性嘗試用百分比或值的梯度線：

background: -moz-linear-gradient(center top, #88EB52 0%, #223312 100%);

這裏是工作提琴：http://jsfiddle.net/FVcdu/1/

來源

2012-11-01 07:45:45

謝謝！我已經檢查了這個元素，排除其他元素，它的效果很好。我已經開始尋找其他元素的問題，我做到了。問題是鏈接上方div元素中的「line-height：1」。 – Umnyjcom

我也碰到這個奇怪的錯誤絆倒在Firefox。這花了一段時間，但我縮小了它是一個從CSS中失蹤的聲明。

當你做漸變時，你應該嘗試並在那裏有所有不同的瀏覽器標準，以便你的漸變在所有瀏覽器中看起來儘可能好。我可以推薦使用Ultimate CSS Gradient Generator這將爲您提供所有瀏覽器的css delcerations可能。

的一個聲明中缺少對我來說，並解決它到底，是W3C標準：linnear梯度（）。

background: linear-gradient(to bottom, #CCCCCC 0%,#EEEEEE 100%);

所以補充說，在你的代碼可能會解決與底部1px的線您的問題在你的梯度因爲它這樣做對我來說。

終極CSS漸變生成： http://www.colorzilla.com/gradient-editor/

來源

2012-11-07 15:50:04 Donpa

線性梯度工件

回答

相關問題