Page 273 - Сила CSS3 Освой новейший стандарт

Создание многостолбцовых макетов без плавающих полей • 273

переноС дочерних элементов поля на новую Строку
По умолчанию, дочерние элементы гибкого поля не переносятся на новую строку, если
места для их отображения недостаточно — они просто вытекают за пределы родительского
элемента. Плавающие элементы работают ровно противоположным образом. Несмотря
на то что иногда умение плавающих элементов занимать несколько строк сбивает с толку,
в целом, это хорошее свойство. Например, элементы li в навигационной полосе — плава-
ющие, поэтому в слишком узком окне, где недостаточно места для отображения их всех
бок о бок, часть элементов переносится на следующую строку, и они все равно остаются
на виду. Если бы элемент ul был гибким полем с горизонтальными дочерними элементами,
то элементы li не переносились бы на новую строку; они упрямо оставались бы в одном
ряду даже в очень узком окне и с очень большим размером шрифта.
В подобных случаях, когда перенос элементов на другую строку действительно требуется,
свойству поля box-lines можно присвоить значение multiple. К сожалению, пока что оно не
поддерживается ни одним из браузеров. Поэтому воздержитесь от модели гибкого поля
на страницах, где возможность переноса содержимого на новую строку действительно
важна, — до лучших времен.

Все возможные значения свойства box-pack перечислены в табл. 7.2. Помните,
что, как и в случае box-align, определения для значений start и end меняются на
противоположные для элементов, которые благодаря значению reverse выводятся
в обратном порядке. Firefox не соблюдает это правило, но в браузерах на базе Webkit
все происходит так, как надо.

Таблица 7.2. Значения свойства box-pack
Значение Горизонтальные дочерние Вертикальные дочерние
элементы элементы
start Размещение у левого края Размещение у верхнего края поля
поля
end Размещение у правого края Размещение у нижнего края поля
поля

center Горизонтальная центровка Вертикальная центровка (равное
(равное количество количество свободного места сверху
свободного места слева и снизу)
и справа)

www.trk.kg