Всем привет, я не очень прошарен в теме фронта и верстки, в процессе изучения скажем так, в общем интересно как можно позиционировать элементы внутри блока, какими свойствами?
Для этого есть justify-content и align-items они двигают элемент по горизонтали и вертикали. Вот пример
<div id="flex_box_box">
1
2
3
4
5
На примере такой структуры я покажу все свойства justify-content и align-items, просто меняй одну строку вместо justify-content в каждом случае:
#flex_box_box {
justify-content: flex-start;
flex-direction: row;
display: flex;
height: 500px;
}
#flex_box_box > div {
border: 1px solid #65894b;
background-color: #f08b18;
width: 100px;
height: 100px;
}
Далее
justify-content: flex-end;
justify-content: center;
justify-content: space-between;
justify-content: space-around;
Теперь тоже самое с align-items, который располагает элементы по вертикали:
align-items: flex-start;
align-items: flex-end;
align-items: center;
align-items: baseline;
align-items: stretch;