ie6 div width 100%

sterx · October 3, 2010

Доброго времени суток!

Бьюсь весь вечер над проблемой некорректного отображения страницы с 100% шириной div'а. Вот код страницы (упростил, но суть видна):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
<head>
  <title>title</title>
  <style type="text/css">
	body {
		margin: 0; padding: 0;
	}
	div#header {
		width: 100%; height: 150px;
		background-color: green;
	}
	div#bigData {
		width: 3000px; border: 1px solid red;
	}
  </style>
</head>
<body>

<div id="header">some text</div>
<div id="bigData"> </div>

</body>
</html>

То есть если под блоком div появляется блок большой ширины, то div не растягивается на всю ширину страницы. Можно решить на JS, но не получается добиться совместимости с ие6, а он в данном случае нужен.

Буду очень благодарен за помощь!

Edited October 3, 2010 by sterx

Justnewone · October 3, 2010

Уберите указание ширины для этого дива.

sigma77 · October 3, 2010

sterx

А что с скриптом не получается?

var w = document.getElementById('bigData').clientWidth;
document.getElementById('header').style.width = (w + 2) + 'px';

Уберите указание ширины для этого дива.

Не поможет

При значении auto, блок пытается занять всю ширину родительского элемента. А родитель в данном случае body, ширина которого равна ширине экрана.

sterx · October 3, 2010

Уберите указание ширины для этого дива.

Вы имеете в виду, конечно, div bigData? Его шириной в 3000 пикселей я эмулирую свою большую широкую таблицу с большим количеством колонок, чтобы просто не кидать этот код сюда.

Удаление ширины первого div header - ни к чему не приведет.

Justnewone · October 3, 2010

Вы имеете в виду, конечно, div bigData? Его шириной в 3000 пикселей я эмулирую свою большую широкую таблицу с большим количеством колонок, чтобы просто не кидать этот код сюда.
Удаление ширины первого div header - ни к чему не приведет.

Да-да, уже понял.

ИЕ7 тож может неадекватно себя повести.

sterx · October 3, 2010

А что с скриптом не получается?
var w = document.getElementById('bigData').clientWidth;
document.getElementById('header').style.width = (w + 2) + 'px';

ie6 не хочет вообще менять ширину div'а - и я так и не нашел, как заставить его это делать. На jquery варианте - что-то вроде

$("div#header").css("width", someWidthCalculatingFunc());

работает - но опять же везде, кроме шестого всеми любимого ie.

Edited October 3, 2010 by sterx

sigma77 · October 3, 2010

sterx,

А где проверяешь?

В меня мой скрипт в ИЕ6 на виртуалке XP работает.

Ну и на jquery он не сильно будет отличаться и должен работать.

Sign In

ie6 div width 100%

Question

sterx

Link to comment

Share on other sites

6 answers to this question

Recommended Posts

Justnewone

Link to comment

Share on other sites

sigma77

Link to comment

Share on other sites

sterx

Link to comment

Share on other sites

Justnewone

Link to comment

Share on other sites

sterx

Link to comment

Share on other sites

sigma77

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information