> Данное свойство прописывается [[flex container и flex items|flex-контейнеру]] Свойство `display` в контексте Flexbox позволяет превратить контейнер в [[flex container и flex items|flex-контейнер]], что, в свою очередь, меняет поведение его дочерних элементов ([[flex container и flex items|flex items]]). ### Значения свойства 1. **flex** — делает элемент flex-контейнером. Его дочерние элементы становятся flex-элементами. 2. **inline-flex** — также делает элемент flex-контейнером, но сам контейнер ведет себя как строчный элемент, то есть он занимает только необходимую ему ширину и располагается на одной строке с другими строчными элементами. ### Синтаксис ```css .parent { display: inline-flex; } ``` ### Визуализация картинкой Скриншоты с примерами сделаны [здесь](https://tpverstak.ru/flex-cheatsheet/#:~:text=%D0%BE%D1%84%D0%B8%D1%86%D0%B8%D0%B0%D0%BB%D1%8C%D0%BD%D0%BE%D0%BC%20%D1%81%D0%B0%D0%B9%D1%82%D0%B5.-,display,-FLEX). По ссылке пример является интерактивным. display: inline-flex; ![[Снимок экрана 2024-07-27 в 10.47.05.png|400]] display: flex; ![[Снимок экрана 2024-07-27 в 10.46.57.png|400]]