У меня есть неупорядоченный список ярлыков. Я хотел бы выровнять их в CSS с левой стороны, как на этой картинке (сейчас я не могу публиковать изображения):

Но пока мне удалось добиться именно этого:

<ul class="badge-list">
  <li>Sci-Fi</li>
  <li>Adventure</li>
  <li>Crime</li>
  <li>Novels</li>
  <li>Children</li>
  <li>Drama</li>
  <li>Historical</li>
</ul>

Стили:

.badge-list {
  .li {
    list-style-type:none;
    display: inline-block;
  }
  .li+.li {margin-left: 5px}
}

Как я могу выровнять по левому краю второй ряд?

css
0
Nelie

1 ответ

.li + .li {margin-left: 5px} - проблема с вставкой поля слева. Почему бы не поставить маржу справа от них? .li {margin-right: 5px}

58584648