используя flexbox на ul (рядом друг с другом) - PullRequest
Новая
       42

используя flexbox на ul (рядом друг с другом)

0 голосов
/ 08 июня 2018

Я пытаюсь использовать flexbox на моем <ul>, чтобы выровнять их рядом друг с другом.Когда я использую это display:flex; flex-direction: row; на моем <ul>, это также повлияет на ребенка (в данном случае все <li>)

Я пытался дать <li> a display:flex; также и flex-direction: column;но это не помогло.

Как мне добиться того, что я пытаюсь сделать здесь?Посмотрите на мою jsFiddle для демонстрации.

1 Ответ

0 голосов
/ 08 июня 2018

Если вы хотите, чтобы каждый <ul> отображался в виде столбца рядом друг с другом, вы можете обернуть все свои <ul> внутри элемента div следующим образом: 

div {
  display: flex;
}

ul {
  display: flex;
  flex-direction: column;
}
<div>
  <ul>
    <li>Test 1</li>
    <li>Test 2</li>
    <li>Test 3</li>
  </ul>
  <ul>
    <li>Best 1</li>
    <li>Best 2</li>
    <li>Best 3</li>
  </ul>
</div>
...