skip to main content

order

css

Кратко 🔗

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

Пример 🔗

В этом примере элемент с классом item встанет последним даже если в разметке будет первым.

.container {
display: flex;
}

.item {
order: 3;
}

Как это понять 🔗

По умолчанию элементы отображаются в том порядке, в котором они расположены в разметке, значение свойства order равно 0. Но это свойство позволяет переставлять их местами.

Как пишется 🔗

Значение задаётся в виде целого отрицательного или положительного числа. Элементы встают по возрастающей.

Пример свойства флекс-элементов order

Подсказки 🔗

💡 Свойство меняет только визуальный порядок. Стоит помнить об этом. Скринридеры по прежнему будут читать элементы по порядку расположения в разметке.

Автор: Алёна,