Линейный градиент фонового изображения CSS, показывающий нежелательную границу в Chrome ⇐ CSS

[Anonymous]

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

Код: Выделить всё

.fancy-underline {
text-decoration: none;
background-image: -webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,.7)),to(rgba(255,255,255,.7))),-webkit-gradient(linear,left top, left bottom,from(#91c678),to(#91c678));
background-image: linear-gradient(rgba(255,255,255,.7),rgba(255,255,255,.7)),linear-gradient(#91c678,#91c678);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 100% 50%;
}

Код: Выделить всё

here is some fancy underline

Я ничего не вижу в вычисленных стилях в отладчик, который может вызвать это, поэтому я думаю, что это проблема с моим линейным градиентом. Может ли кто-нибудь указать мне правильное направление?

Подробнее здесь: https://stackoverflow.com/questions/605 ... -in-chrome