В CSS блок имеет позицию в трех измерениях. В дополнение к горизонтальному и вертикальному положению, блоки выкладываются вдоль оси Z друг над другом. Порядок, в котором дерево документа отрисовывается на экране, описывается с помощью контекста наложения. Если для элементов свойства z-index и position не заданы явно, контекст наложения равен порядку их расположения в исходном коде: Свойство z-index создает новый контекст наложения...

Сегодня предлагаем вашему вниманию перевод материала, который посвящён странностям CSS, о которых, как полагает автор этого материала, мало кто знает. Вертикальные поля Что станет с элементом, если назначить ему свойство padding-top: 50%? Интуитивно понятно, что подобное свойство устанавливает размер поля от верхнего края содержимого элемента, размер которого составляет 50%… От чего берутся эти 50%? Собственно говоря, в определённый момент интуиция при разборе особенностей этого свойства оказывается бесполезной...