можешь один для круга другой для лого или типа того

1 бордер второй через тень и будет норм, но я бы заплил картинкой через фон и сделал тень

ну да и еще у каждого бордера свой blur))

Бордер елемента, бордер бефо, бордер афте

там просто есть такие места где по 10 таких бордеров))

Тогда картинкой

мне проще 10 дивов))

Ну не знаю насколько это целесообразно. Но.. У всех свои тараканы в голове😂

все что можно делать версткой нужно делать без картинок

Не выгодней ли будет ну не знаю. Подгрузить например 1 полоску и репитить

Раз уж мы идем во все тяжкие)

там требования жесткие к ретине, а png будет размываться, или svg или css

Свг ж не считается картинкой, да? 😂

да но картинки это очень не удобно, все только через css

Интересно было бы посмотреть на удобство такой реализации. 🤔

#сборка_gulp_pug_scss

вот кстати)

Ребят, не могу понять, почему в первом и третьем случае с лепестками (petal #one #three) все работает как надо, а со вторым и четвертым как-то иначе. У меня есть класс wheel, у которого position: relative. У вложенных в него всех лепестков position: absolute, дабы местоположение каждого из лепестков я высчитываю от края рамки для класса wheel. И в случае с первым и третьим, когда я говорю, что left и right 0px, это работает верно, и лепестки отображаются ровно от края рамки класса wheel. А когда я задаю для второго и четвертого top и bottom 0px, по аналогии с первым и третьим лепестками, то эти лепестки начинают отрисовываться выше или ниже самой рамки для класса wheel. Почему для первого и третьего логика работает, а для второго и четвертого нет?

https://codepen.io/llvll/pen/dyGBjpW