Век живи - век дурак II
Я тут все изобретаю
велосипед, как бы в дивах содержимое по вертикали центровать. Ну да, display: table-cell, но - кто бы мог подумать?! - ишак этого не понимает, а хаков хотелось бы избежать.
Генеральная идея была такая: контент сдвинуть вниз на 50%
высоты контейнера, а потом вверх на 50%
высоты контента. Тогда середина контента должна совпасть с серединой ящика.
Сначала я попробовал сдвигать контент с помощю поля. Но опаньки! Процентное значение padding/margin задается относительно
ширины контейнера даже для вертикальных полей. Просрано!
Тогда бобробуем двигать с помощью позиционирования. Возьмем такую вот конструкцию:
<div class="main">
<div class="spacer"></div>
<div class="wrap">
<div class="content">
СЛАВА СОТОНЕ
</div>
</div>
</div>
И присобачим к ней такой вот цсс:
.main {
background: blue;
height: 500px;
width: 500px;
}
.spacer {
height: 50%;
background: brown;
}
.wrap {
background: yellow;
}
.content {
position: relative;
top: -50%;
}
Я рассчитывал, что пустой див "spacer" отожмет контент вниз на 50% общего контейнера "main", а потом контент уедет вверх на половину высоты своего контейнера "wrap" (который по высоте контенту и равен).
Каким образом пузи-идея ловко обосралась, можно посмотреть здесь. Адекватные браузеры просто отказываются смещать див с контентом, а ишак еще и вешает его наверх, как будто контейнер не "wrap", а внешний "main".
Теоретически вроде бы все верно и должно работать. Что мешает изымать див контента из нормального потока - непонятно. Я пробовал играться с разными сочетаниями position: relative и position: absolute на разных дивах, но нихрена не добился. В инете пошарился - методов центровки немало, но они то не кроссбраузерные, то ацко громоздкие, то кошерны только в частных случаях (например только для строчных элементов, или только для целой страницы в качестве контейнера, или для контейнера известного размера, и т.д.). Короче, не удалось ничего рабочего найти.
Ну как-то же выкручиваются люди?
Памаги-и-и-и-и-т-и-и-и-и-и!
PS а как чотко прижимать к низу страницы футер (сохраняя возможность растяжения страницы по вертикали) я таки придумал, хоть и мозгами поцтрадал. Через отрицательные поля, как и с многоколоночной версткой. Дж! Изобретать велосипед немодно, зато понимание в мозги вбивается насмерть.