Вот несколько часто используемых методов CSS Flexbox и примеры кода:

1. display: flex;: это свойство используется для создания гибкого контейнера.

.container {
  display: flex;
}

2. flex-direction: row;: это свойство определяет направление гибких элементов.

.container {
  flex-direction: row;
}

center;: это свойство выравнивает гибкие элементы вдоль главной оси.

центр;

4. align-items: flex-start;: это свойство выравнивает гибкие элементы по поперечной оси.

.container {
  align-items: flex-start;
}

5. flex-wrap: Wrap;: это свойство позволяет гибким элементам переноситься на несколько строк.

.container {
  flex-wrap: wrap;
}

6. flex-grow: 1;: это свойство определяет, как гибкие элементы должны расти, чтобы заполнить доступное пространство.

.item {
  flex-grow: 1;
}

1. order: 2;: это свойство изменяет порядок гибких элементов.

.item {
  order: 2;
}

8. align-self: flex-end;: это свойство переопределяет выравнивание по умолчанию для конкретного гибкого элемента.

.item {
  align-self: flex-end;
}

9. flex-basis: 200px;: это свойство определяет начальный размер гибкого элемента.

.item {
  flex-basis: 200px;
}

10. flex-shrink: 0;: это свойство определяет, как гибкие элементы должны сжиматься, если недостаточно места.

.item {
  flex-shrink: 0;
}