Frontend Formula

💫Гайд по flexbox, Часть 2



Свойства флекс-элемента:

👉 order — Позволяет менять порядок отображения флекс-элементов внутри флекс-контейнера.



👉 flex-grow — Указывает, может ли вырастать флекс-элемент при наличии свободного места, и насколько.



👉 flex-shrink — Полностью противоположно свойству flex-grow. Если в контейнере не хватает места для расположения всех элементов без изменения размеров, то свойство flex-shrink указывает, в каких пропорциях элемент будет уменьшаться.



👉 flex-basis — Указывает на размер элемента до того, как свободное место будет распределено.



👉 flex — Свойство-шорткат, с помощью которого можно указать значение трёх свойств одновременно: flex-grow, flex-shrink и flex-basis.



👉 align-self — Позволяет выровнять один или несколько элементов иначе, чем задано у родительского элемента.



Полезные ссылки:

✔️Как реально работает flex-grow

✔️Как реально работает flex-shrink

✔️Песочница Флексбоксов



Статья: https://doka.guide/css/flexbox-guide/



#css #дока



👉 @frontend_formula