Как сделать адаптивный треугольник с градиентом на css?

Question

[timtimIT]

Здравствуйте.

Подскажите,

Как сделать треугольник с градиентом на css?

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

Answer 1

[Сергей Андреев]

Вот есть такой интересный вариант через
transform: rotate(-90deg);
впринципе можно даже clip не использовать

Comments

[timtimIT]

спасибо, не совсем то. нужно чтобы было адаптивно, ширина родительского блока 100% относительно body

Answer 2

[Николай]

background: linear-gradient(to right bottom, transparent 50%, red 50%) center top / 100% 50% no-repeat, linear-gradient(to right top, transparent 50%, red 50%) center bottom / 100% 50% no-repeat