Как такое сделать в Ie ?

Konstantin S. · 30.06.2006, 20:03

Добрый день.

Вот такой вот вопросик есть к участникам форума...
Имеем вот такой HTML файл:

Код:

<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>
</body>
</html>

В браузере видим такую картинку:
http://www.smartposter.ru/pic7.gif

Теперь добавляем в заголовок вот такой стиль:

Код:

html {margin-top: 100px;}

FireFox показывает вот так:
http://www.smartposter.ru/pic8.gif
(то есть, он весь контент сместил вниз).

А вот в Internet Explorer вниз смещается весь контент, кроме абсолютно позиционированного слоя (ABSOLUTE DIV).

Не знает ли кто-нибудь, как сделать, чтобы в IE вниз сместилось все ?

Заранее спасибо.

Uratsakidogi · 30.06.2006, 20:13

Честно говоря, у меня в ИЕ вообще контент не смещается, но можно попробывать задать position: relative; для html.

Konstantin S. · 30.06.2006, 20:32

Нее... Не помогает...

vision · 01.07.2006, 13:10

Konstantin S., ну тогда body, или вообще забить на IE.

Konstantin S. · 01.07.2006, 15:00

Вот, что я пока придумал:

Код:

<!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">
<head>
<style type="text/css">
body { position: relative; padding: 10px; margin-top: 100px; background-color: #BFB; }
</style>
</head>
<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>
</body>
</html>

Все работает как надо. Однако, если не указать в заголовке

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

То ничего не работает.

А как бы сделать так, чтобы сдвинуть все вниз даже в Quirk режиме браузера ?

dantistus · 02.07.2006, 13:10

body{margin-top:100px}
.absolute_div{position:absolute;left:0px;top:100px ;}

Так нельзя?

Konstantin S. · 02.07.2006, 20:57

Я прекрасно понимаю, что я сам могу сверстать пагу, как мне нужно. Вопрос стоит в модификации уже существующей страницы. Ну вот хочу я загрузить например yandex.ru и чтобы страница эта у меня отображалась с отступом в 100 пикселей сверху. Если в документе есть doctype, то я тогда просто подгружу в браузер свой CSS, который и сдвинет контент. А если doctype нету, то и CSS не сработает. Вот я и ищу способ, который бы позволил с малыми модификациями существующей страницы провернуть такой трюк.

kost · 03.07.2006, 11:14

Сделать родительский блок, и прописать ему position:relative.

Konstantin S. · 03.07.2006, 18:43

Да, но при этом блоки с position:absolute вниз не сдвинутся.

Uratsakidogi · 03.07.2006, 19:19

Сдвинутся, но этот спооб тебе видмо не подойдет, раз ты не хочешь править код вставляемой страницы (если хотел бы, просто вставлял бы доктайп, правда?).

Самое логичное здесь — использовать фреймы. Для того они и были придуманы, в конце-концов.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Подскажите, как сделать такое же?	kot57	Графические работы	4	27.01.2016 15:17
Трудно ли сделать такое ?	qwoz	Технологии Flash	12	02.02.2011 23:41
Это что за ДР такое?	Silver	Книга жалоб и предложений	11	01.04.2007 19:51
Как сделать такое?	-=FRE$H=-	Технологии Flash	11	17.01.2006 09:25
Подскажите, пожалуйста, как сделать такое меню?	Lebedev	ASP, Perl, PHP и MySQL	4	18.12.2005 21:32

30.06.2006, 20:03	#1
Konstantin S.	Добрый день. Вот такой вот вопросик есть к участникам форума... Имеем вот такой HTML файл: Код: <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> </body> </html> В браузере видим такую картинку: http://www.smartposter.ru/pic7.gif Теперь добавляем в заголовок вот такой стиль: Код: html {margin-top: 100px;} FireFox показывает вот так: http://www.smartposter.ru/pic8.gif (то есть, он весь контент сместил вниз). А вот в Internet Explorer вниз смещается весь контент, кроме абсолютно позиционированного слоя (ABSOLUTE DIV). Не знает ли кто-нибудь, как сделать, чтобы в IE вниз сместилось все ? Заранее спасибо.

30.06.2006, 20:13	#2
Uratsakidogi	Честно говоря, у меня в ИЕ вообще контент не смещается, но можно попробывать задать position: relative; для html.

30.06.2006, 20:32	#3
Konstantin S.	Нее... Не помогает...

01.07.2006, 13:10	#4
vision	Konstantin S., ну тогда body, или вообще забить на IE.

02.07.2006, 13:10	#6
dantistus	body{margin-top:100px} .absolute_div{position:absolute;left:0px;top:100px ;} Так нельзя?

02.07.2006, 20:57	#7
Konstantin S.	Я прекрасно понимаю, что я сам могу сверстать пагу, как мне нужно. Вопрос стоит в модификации уже существующей страницы. Ну вот хочу я загрузить например yandex.ru и чтобы страница эта у меня отображалась с отступом в 100 пикселей сверху. Если в документе есть doctype, то я тогда просто подгружу в браузер свой CSS, который и сдвинет контент. А если doctype нету, то и CSS не сработает. Вот я и ищу способ, который бы позволил с малыми модификациями существующей страницы провернуть такой трюк.

03.07.2006, 11:14	#8
kost	Сделать родительский блок, и прописать ему position:relative.

03.07.2006, 18:43	#9
Konstantin S.	Да, но при этом блоки с position:absolute вниз не сдвинутся.

03.07.2006, 19:19	#10
Uratsakidogi	Сдвинутся, но этот спооб тебе видмо не подойдет, раз ты не хочешь править код вставляемой страницы (если хотел бы, просто вставлял бы доктайп, правда?). Самое логичное здесь — использовать фреймы. Для того они и были придуманы, в конце-концов.