Добрый день.
Вот такой вот вопросик есть к участникам форума...
Имеем вот такой HTML файл:
<body style="border: 1px dashed #999;">
<div style="background-color: #9F9; position:absolute; left: 0px; top: 0px;">ABSOLUTE DIV</div>
<div style="background-color: #99F;">NORMAL DIV</div>
В браузере видим такую картинку:
http://www.smartposter.ru/pic7.gif
Теперь добавляем в заголовок вот такой стиль:
html {margin-top: 100px;}
FireFox показывает вот так:
http://www.smartposter.ru/pic8.gif
(то есть, он весь контент сместил вниз).
А вот в Internet Explorer вниз смещается весь контент, кроме абсолютно позиционированного слоя (ABSOLUTE DIV).
Не знает ли кто-нибудь, как сделать, чтобы в IE вниз сместилось все ?
Вот, что я пока придумал:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
body { position: relative; padding: 10px; margin-top: 100px; background-color: #BFB; }
<body style="border: 1px dashed #999;">
<div style="background-color: #9F9; position:absolute; left: 0px; top: 0px;">ABSOLUTE DIV</div>
<div style="background-color: #99F;">NORMAL DIV</div>
<div>TEST TEST TEST</div>
Все работает как надо. Однако, если не указать в заголовке
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
То ничего не работает CSS стили.
А как бы сделать так, чтобы сдвинуть все вниз даже в Quirk режиме браузера ?