Flexbox выравнивание содержимого пространства между не работает - PullRequest
Новая
       12

Flexbox выравнивание содержимого пространства между не работает

0 голосов
/ 14 октября 2018

Так что я пытаюсь сделать так, чтобы 3 div были выровнены по вертикали как 1-й сверху, 2-й в середине, 3-й снизу.

Мой HTML: 

<div class="d-flex flex-column align-content-spacebetween" style="height:100%;">
  <div></div>
  <div></div>
  <div></div>
</div>

почему это не работает?они выровнены по верху один под другим.

1 Ответ

0 голосов
/ 14 октября 2018

Поскольку вы не поделились своим CSS-кодом, трудно сказать, но вот пример использования flex 

.align-content-spacebetween{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100vh;
}

.align-content-spacebetween div{
  border: 1px solid black;
  text-align: center;
  height: 50px;
}
<div class="align-content-spacebetween">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>
...