@Mr_Pride7
Ничего не умею, но хочу научиться

Как сверстать полоску состоящую из множества кругов?

Приветствую всех! Верстаю макет для стажировке, и возникли проблемы с со стилизацией блока. Вот что должно получиться.
.5c7fc2a4a2bc3709837372.jpeg
Нужно сделать полоску из кружков, длина полосы должны меняться с разрешением. Пытался сделать так:
Серую полоску делал через пустой блок с верхней границей, сверху накладывал через before вторую с абсолютным позиционированием, но полоски криво накладываются(код не скидываю, т.к. параллельно практикую bem и пока это похожу на кашу)
  • Вопрос задан
  • 193 просмотра
Решения вопроса 2
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
background-image radial-gradient
и background-repeat

https://jsfiddle.net/Lm6duqb4/

С наложением синих https://jsfiddle.net/6jL3dhet/
Проблемы кратности ширины можно по разному решать.
Ответ написан
HamSter007
@HamSter007
HTML/CSS верстальщик
В дополнение к Ankhena :

div {
  background: radial-gradient(ellipse at center, #ccc 0%, #ccc 50%, transparent 50%);
  background-size: 50px 50px;
  background-repeat: repeat-x;
  background-position: 0px center;
}


Пример на jsbin
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы