Свойство CSS `box-direction`

Устарело: Эта функция больше не рекомендуется. Хотя некоторые браузеры всё ещё могут её поддерживать, она уже могла быть удалена из соответствующих веб-стандартов, может находиться в процессе исключения или сохраняться только в целях совместимости. Избегайте её использования и по возможности обновите существующий код; при принятии решения ориентируйтесь на таблицу совместимости в нижней части этой страницы. Учтите, что эта функция может перестать работать в любой момент.

Нестандартное: Эта функция не является стандартной и не входит в процесс стандартизации. Не используйте её на общедоступных веб-сайтах: она будет работать не у всех пользователей. Кроме того, реализации могут значительно различаться, а поведение может измениться в будущем.

Предупреждение: Это свойство из первоначального проекта модуля CSS Flexible Box Layout, которое было заменено более новым стандартом. -moz-box-direction будет использоваться только в XUL, а прежний стандарт box-direction был заменён на flex-direction. Информацию о текущем стандарте см. в разделе flexbox.

Свойство box-direction CSS определяет, располагает ли блок своё содержимое в обычном порядке (от верхнего или левого края) или в обратном порядке (от нижнего или правого края).

Синтаксис

/* Keyword values */
box-direction: normal;
box-direction: reverse;

/* Global values */
box-direction: inherit;
box-direction: initial;
box-direction: revert;
box-direction: revert-layer;
box-direction: unset;

Значения

Для этого свойства указывается одно из следующих ключевых слов:

normal: Блок располагает своё содержимое от начала (от левого или верхнего края).
reverse: Блок располагает своё содержимое от конца (от правого или нижнего края).

Примечания

Край блока, обозначенный как начало для целей раскладки, зависит от ориентации блока:

Для горизонтальных элементов началом является верхний край.
Для вертикальных элементов началом является левый край.

Противоположный началу край обозначается как конец.

Если направление задано с помощью атрибута dir элемента, этот стиль игнорируется.

Формальное определение

Исходное значение	normal
Применяется к	элементам со значением CSS `display` <code>box</code> или <code>inline-box</code>
Наследуется	нет
Вычисленное значение	как задано
Тип анимации	дискретный

Формальный синтаксис

box-direction = normal | reverse

Примеры

Задание направления блока

.example {
  /* bottom-to-top layout */
  -moz-box-direction: reverse; /* Mozilla */
  -webkit-box-direction: reverse; /* WebKit */
  box-direction: reverse; /* As specified */
}

Спецификации

Не входит ни в один стандарт.

Совместимость с браузерами

	Настольные компьютеры					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android	WebView на iOS
`box-direction`	1	12	49 1	15	3 1.1–3	18	49 4	14	1	1.0	4.4	1

См. также

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/box-direction