Как сделать такую ленту в Хедере?

Question

[Gorila Lopster]

Привет всем, подскажите плс

Каким способом лучше вставить ленту в хедер ? Сейчас сделал через background-image, но при изменении разрешения экрана, она ведёт себя не стабильно и меняя высоту и ширину, а на ней размещены элементы , которые требуют точности.
Думал может разрезать её на три части : левую :before , центральную background и правую :after
Подскажите мысли ?

Answer 1

[Александр]

Comments

[Gorila Lopster]

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

[Александр]

Gorila Lopster, Боковые по высоте всегда равны центральной, но если Вы хотите, чтобы при любом масштабе была одинаковая высота, для .ribbon__center надо будет установить высоту в vh например.

[Gorila Lopster]

Александр, Вообще четко сделано. Спасибо большое. Осталось разобраться в переменных)