Как сделано такое меню на html или js?

Question

[AlexAll]

Как сделано такое меню на html или js? кто нибудь знает похожие примеры реализации? поделитесь плиз

Comments

[alex]

это верстается за 5-10 минут

[AlexAll]

Alex, Примеры есть?

Answer 1

[archelon]

заготовка:

a.menu_item:after {
  display:block;
  content: "";
  width:5px;
  height:5px;
  border-radius:5px;
  background-color: grey;
}
a.menu_item:hover:after {
  background-color: red;
}

Comments

[AlexAll]

попробовал, если ставить display:block; то все li выстраиваются построчно, поставил display:inlain-block; выстроились как надо в одну строку, но маркеры стали справа после текста.

Как сдвинуть маркеры вниз как их позиционировать?

[archelon]

с помощью абсолютного позиционирования.

.menu_item {
  position: relative;
}
.menu_item:after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  background-color: red;
  border-radius: 5px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -5px;
}