ошибка 100% высоты css - PullRequest
Новая
       19

ошибка 100% высоты css

2 голосов
/ 19 мая 2009

Когда я изменяю размер окна и когда появляется вертикальная полоса прокрутки, если я прокручиваю ее до самого дна, - нижняя часть ломается. Я не понимаю почему, но я думаю, что это как-то связано с тем, как страница использует 100% высоты. Любая помощь будет оценена!

Вот эта страница: zxsdesign.com / main1.html

Вот скриншот

zxsdesign.com / bug1.PNG http://zxsdesign.com/bug1.PNG

Ответы [ 4 ]

2 голосов
/ 19 мая 2009

Это сочетание вас, использующего свойство CSS height и абсолютное позиционирование. ajm говорил об использовании min-height - в идеале вы должны использовать его вместо height, когда делаете вещи на 100% выше.

На вашу другую проблему. Когда вы размещаете элементы абсолютно, они больше не являются частью структуры страницы. Вместо этого они живут в отдельной плоскости и поэтому не влияют на размеры страницы. Когда ваш <div id="flashcontent"> проходит за границу окна, это не влияет на границы <body>.

Вы можете исправить это, не используя position: absolute. Там нет реальной необходимости. Вместо этого вы можете расположить элемент #flashcontent в обычном режиме и полностью избавиться от элемента #bg - просто задайте фону #flashcontent. Затем используйте margin: 0 auto; и padding-top: 179px;, чтобы расположить его в правильном месте.

0 голосов
/ 19 мая 2009

100% высота - одна высота экрана. Если вы прокрутите вверх, он покрывает 100% высоты. Сделайте так, чтобы ваши блоки тоже масштабировались или, по крайней мере, переместились в центр экрана. Вы можете сделать это, установив их верхний и нижний отступы на auto.

Кроме того, ваша метка головы закрыта неправильно. Отметьте это

0 голосов
/ 19 мая 2009

Ваша страница полностью основана на использовании 100% высоты для всех ваших Элементов. Если окно просмотра браузера пользователя достаточно велико, это нормально; однако, если они изменят размер своего браузера на small , ваша страница будет на 100% меньше этой высоты, и вещи выпадут из нижней части.

Посмотрите на настройку минимальной высоты на одном из ваших элементов контейнера. Это заставит вещи перестать изменять размер, если окно браузера упадет ниже этой высоты. Или вы можете установить достаточно простую старую высоту, достаточную для размещения фрагмента флеш-памяти на одном из элементов контейнера, и позволить другим наследовать его.

И, так как IE6 не поддерживает минимальную высоту (FF2 +, IE7, Safari все это делают), вам нужно взломать его в следующим образом.

0 голосов
/ 19 мая 2009

к сожалению высота: 100%; реализован иначе ... Вы не можете быть уверены, что браузер делает то, что вы хотите, когда вы его используете.

Попробуйте использовать clear: left; или ясно: оба; в твоем стиле.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...