奇怪的Safari瀏覽器CSS的臭蟲以CSS漸變

你好，

我添加了一個CSS漸變到該按鈕，但似乎出現一個奇怪的線。有什麼方法可以解決這個問題嗎？

的CSS：

#view-content .billing-form #submit { 
    background: #94c723; /* Old browsers */ 
    background: -moz-linear-gradient(top, #94c723 0%, #6cb119 100%); /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#94c723), color-stop(100%,#6cb119)); /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, #94c723 0%,#6cb119 100%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, #94c723 0%,#6cb119 100%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(top, #94c723 0%,#6cb119 100%); /* IE10+ */ 
    background: linear-gradient(to bottom, #94c723 0%,#6cb119 100%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#94c723', endColorstr='#6cb119',GradientType=0); /* IE6-9 */ 
    border: none; 
    border-top: 1px solid #a1d61a; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    border-radius: 3px; 
    color: #FFFFFF; 
    font-size: 18px; 
    line-height: 40px; 
    padding: 0 70px; 
    font-weight: bold; 
    font-family: Arial, sans-serif; 
}

來源

2013-04-28 Alex Jeffrey

我試着在Safari 5.1.2版（6534.52.7）上用這個[fiddle]（http://jsfiddle.net/z8D9A/），沒問題。你能提供有關的HTML代碼嗎？ – Bigood 2013-04-28 16:58:26

html只是一個輸入類型=提交。另外，我相信這會影響最新的Safari（6？） – 2013-04-28 17:00:59

我正在更新我的Safari版本。同時，使用Safari的HTML/CSS檢查器檢查應用於您的提交按鈕的所有規則 – Bigood 2013-04-28 17:08:35

只是一個想法，但爲什麼不把上pixlr的gradiant覆蓋，只是將其設置爲背景圖片。那麼你不再有這個問題，你可以節省大約十行代碼..

來源

2013-06-19 17:27:17

這是我最終採用的方法 – 2013-06-25 09:16:25

試試這個：

#view-content .billing-form #submit { 
    background: #94c723; /* Old browsers */ 
    background: -moz-linear-gradient(top, #94c723 0%, #6cb119 100%); /* FF3.6+ */ 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#94c723), color-stop(100%,#6cb119)); /* Chrome,Safari4+ */ 
    background: -webkit-linear-gradient(top, #94c723 0%,#6cb119 100%); /* Chrome10+,Safari5.1+ */ 
    background: -o-linear-gradient(top, #94c723 0%,#6cb119 100%); /* Opera 11.10+ */ 
    background: -ms-linear-gradient(top, #94c723 0%,#6cb119 100%); /* IE10+ */ 
    background: linear-gradient(to bottom, #94c723 0%,#6cb119 100%); /* W3C */ 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#94c723', endColorstr='#6cb119',GradientType=0); /* IE6-9 */ 
    border: none; 
    border-top: 1px solid #a1d61a; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    border-radius: 3px; 
    color: #FFFFFF; 
    font-size: 18px; 
    line-height: 40px; 
    padding: 0 70px; 
    font-weight: bold; 
    font-family: Arial, sans-serif; 
    display: block; 
    outline: none; 
}

來源

2013-05-02 20:29:17 Rob1n

不幸的是，這並沒有解決這個問題 - 感謝您的回覆，儘管 – 2013-06-25 09:17:03

奇怪的Safari瀏覽器CSS的臭蟲以CSS漸變

回答

相關問題