Как сделать полноценный градиент у фона текста?

Question

[Дима Паутов]

https://jsfiddle.net/m8pusv07/1/

Никак не получается. Кроме как сделать сам текст градиентовым, используя

-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

Ничего не получается

Вот пример, как нужно:

Answer 1

[Сергей Горячев]

span {
background: linear-gradient(to bottom, rgba(0,116,180,1) 0%, rgba(0,168,135,1) 100%);
display: block; // span по умолчанию строчный элемент, делаем его блочным
}

https://jsfiddle.net/webirus/m8pusv07/2/

Comments

[Дима Паутов]

Нет, ты не понял. Это всё я знаю. Нужно что бы градиент шёл по краям текста

[Сергей Горячев]

Дима Турков: Все равно тебя не понял) Покажи картинку.

[Дима Паутов]

Sergey Goryachev: Прикрепил картинку

[Сергей Горячев]

Дима Турков: Сомневаюсь, что так получится. Ну, посмотрим решения.

Answer 2

[Ivan Korsakov]

Добро пожаловать в мир костылей: Линк

Comments

[Дима Паутов]

Ну так я тоже думал. Ясно, видимо css пока такого не умеет.