Дырка под футером при показе блока в IE 6
Дата публикации: 19.10.2009
Имеем обычную верстку, с прижатым подвалом (футером) к низу плюс есть блоки, которые появляются по какому-нибудь событию (напрмиер, по клику на кнопке, под ней появляется блок с текстом).
Проблема
В IE 6 при появлении такого блока, под подвалом появляется «дырка», несмотря на то, что он (подвал) прижат к низу.
Заметка баг появляется, только если появлящиеся блоки находятся в нормальном потоке блоков (т.е. без position: absolute/fixed). Баг может не показаться при первом показе блока, но при повторном и дальнейших показах есть.
Пример, демонстрирующий данный косяк (увидеть можно только в IE6).
Решение
Достаточно добавить подвалу float:
.footer {
[...]
float: left;
width: 100%;
}
Результат. Преимущества:
- просто
- валидно
Недостаток — из-за того, что float прижимает блок влево/право, для сайтов, выровненных по центру экрана приходится добавлять дополнительный контейнер, который выровняет подвал по центру.