Странный прозрачный градиент цвета в Firefox

Question

Я создаю свое новое портфолио, и у меня есть странная проблема с градиентом в CSS. Я использовал CSS градиентный генератор для градиента прозрачный до фиолетовый до фиолетовый. Конечно, есть несколько строк для старых браузеров тоже в моем коде, но W3C строка выглядит следующим образом:

background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(42,28,80,0.29) 29%,rgba(42,28,80,1) 100%); 

И я получаю очень странное поведение на Firefox. http://i.stack.imgur.com/8cN1M.jpg

Чтобы вывести ошибку, для этого кода:

background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(42,28,80,1) 29%,rgba(42,28,80,1) 100%); 

http://i.stack.imgur.com/Utrgr.jpg

Похоже, что градиент не знает, как сделать переход между RGBA (255,255,255,0) до фиолетового если есть изображение под этим. Я изменил свое изображение в фоновом режиме на нормальный цвет, и градиент был хорошим. Можно ли исправить?

Answer 1

Это исправлено в Firefox 36 по bug 591600

С Firefox 36 года градиенты будут использовать предварительно умноженные цвета, которые сделают преобразования в/из прозрачной работы, как вы этого ожидаете.

Answer 2

мне удалось это исправить и на версии ниже, чем Firefox 36.

Firefox была проблема для создания симпатичной переход между белым прозрачным и цвета, самый простой способ исправить это изменить первую альфа-0 цвет в тот же цвет, как и в альфа-1, так что это:

background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(42,28,80,1) 100%); 

должен быть изменен на:

background: linear-gradient(to right, rgba(42,28,80,0) 0%, rgba(42,28,80,1) 100%);