10.6. Расчет высоты и полей.

Для подсчета значений 'top', 'margin-top', 'height', 'margin-bottom' и 'bottom', необходимо делать различие между типами блоков:

1. внутристрочные, незаменяемые элементы
2. внутристрочные, заменяемые элементы
3. блочные, незаменяемые элементы с нормальным размещением
4. блочные, заменяемые элементы с нормальным размещением
5. плавающие, незаменяемые элементы
6. плавающие, заменяемые элементы
7. абсолютно позиционированные, незаменяемые элементы
8. абсолютно позиционированные, заменяемые элементы

Пункты 1-6 включают относительное позиционирование.

10.6.1. Внутристрочные незаменяемые элементы.

Если 'top', 'bottom', 'margin-top', или 'margin-bottom' определены, как 'auto', то их подсчитанное значение равно 0. Свойство 'height' не применяется, но высота блока определяется свойством 'line-height'.

10.6.2. Внутристрочные заменяемые блочные элементы, заменяемые элементы при нормальном размещении и заменяемые элементы с плавающим смещением.

Если 'top', 'bottom', 'margin-top' или 'margin-bottom' определены, как 'auto', то их подсчитанное значение равно 0. Если 'height' - 'auto', то подсчитанное значение является внутренней высотой.

10.6.3. Блочные незаменяемые элементы при нормальном размещении и незаменяемые элементы с плавающим смещением.

Если 'top', 'bottom', 'margin-top' или 'margin-bottom' определены, как 'auto', то подсчитанное значение равно 0. Если 'height' - 'auto', то высота зависит от того, имеет ли элемент какой-либо блочный дочерний элемент. Если он имеет только внутристрочный дочерний элемент, то высота определяется от вершины самого высокого строчного блока до низа самого низкого строчного блока. Если он имеет блочный элемент, то высота определяется расстоянием от верхнего края границы самого высокого блочного дочернего блока до нижнего края границы самого низкого блочного дочернего блока. Только дочерние элементы в нормальном размещении берутся во внимание (т.е. плавающие блоки и абсолютно позиционированные блоки игнорируются, а относительно позиционированные блоки рассматриваются без их смещения). Обратите внимание, что дочерний блок может быть анонимным блоком.

10.6.4. Абсолютно позиционированные, незаменяемые элементы.

Для абсолютно позиционированных элементов вертикальные размеры должны удовлетворять следующее ограничение:

'top' + 'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' + 'bottom' = высота объемлющего блока

(Если стиль границы установлен 'none', то используйте '0', как ширину границы). Решение для этого ограничения достигается через ряд замен в следующем порядке:

1. Если 'top' имеет значение 'auto', то замените его расстоянием от верхнего края объемлющего блока до верхнего края поля гипотетического блока, который имел бы первый блок элемента, если бы его свойство 'position' было бы 'static'. (Несмотря на фактические расчеты блока, устройство вывода свободно в решении возможного размещения). Значение – отрицательное, если гипотетический блок лежит выше объемлющего блока.
2. Если оба 'height' и 'bottom' определены, как 'auto', то замените значение 'bottom' на 0.
3. Если 'bottom' или 'height' определены, как (все еще) 'auto', то замените любое 'auto' у 'margin-top' или 'margin-bottom' на '0'.
4. Если в этой точке оба 'margin-top' и 'margin-bottom' – все еще 'auto', то решите уравнение при жестком условии, что два поля должны быть равны.
5. Если в этой точке есть только одно левое значение 'auto', то решите уравнение для такого значения.
6. Если в этой точке значения жестко ограничены, то игнорируйте значение для 'bottom', и решите уравнение для такого значения.

10.6.5. Абсолютно позиционированные, заменяемые элементы.

Эта ситуация похожа на предыдущую, за исключением того, что элемент имеет внутреннюю высоту. Последовательность замен смотрите ниже:

1. Если 'height' - 'auto', то замените внутреннюю высоту элемента.
2. Если 'top' имеет значение 'auto', то замените его на расстояние от верхнего края объемлющего блока до верхнего края поля гипотетического блока, который был бы первым блоком элемента, если бы его свойство 'position' было 'static'. (Не смотря на фактические расчеты такого блока, устройства вывода свободны в выборе возможного положения). Значение – отрицательное, если гипотетический блок находится выше объемлющего.
3. Если 'bottom' - 'auto', то замените любое 'auto' в 'margin-top' или 'margin-bottom' на '0'.
4. Если в этой точке оба 'margin-top' и 'margin-bottom' все еще - 'auto', то решите уравнение для жестких условиях, при которых два поля должны быть равны.
5. Если в этой точке есть только одно левое 'auto', то решите уравнение для такого значения.
6. Если в этой точке значения находятся в жестких условиях, то игнорируйте значение для 'bottom', и решите уравнение для такого значения.