Надо чтобы после перезагрузки страницы у всех блоков менялся border-left: 35px solid #00f;
рандом.
У одного может быть top у другого left у третьего right и так далее. Помогите пожалуйста
body {
margin: 50px;
}
.circle {
width: 200px;
height: 200px;
border-radius: 50%;
position: relative;
border-radius: 50%;
overflow: hidden;
}
.circle__img,
.circle:before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.circle__img {
object-fit: cover;
}
.circle:before {
content: '';
border-left: 35px solid #00f;
border-radius: 100px;
z-index: 1;
}
<div class="circle">
<img class="circle__img" src="https://www.vbetnews.com/wp-content/uploads/2018/08/Jurgen-Klopp.png" alt="">
</div>
<div class="circle">
<img class="circle__img" src="https://www.vbetnews.com/wp-content/uploads/2018/08/Jurgen-Klopp.png" alt="">
</div>
<div class="circle">
<img class="circle__img" src="https://www.vbetnews.com/wp-content/uploads/2018/08/Jurgen-Klopp.png" alt="">
</div>