VPF::div занял все свободное место - Форум программистов

z006

Дата 17.2.2011, 00:34 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 71
Регистрация: 12.6.2009

Репутация: нет
Всего: нет

сижу и в шоке смотрю на монитор.и ощущаю что это пустяк,я такое давно решал,а тупо мысль не идет. smile

задача такова:
3 горизонтальных дива,один под другим.у всех ширина 100%
верхний вверху прижат и забыли про него.нижний должен быть прижат к низу.тоже решаемо легко.но!средний должен занимать все пространство между верхним и нижним при любом размере экрана(не катит залезать под любой из них,в нем будет контент на всю высоту).в него потом будет помещаться контент,высота которого будет подгоняться под этот див.иными словами жмем контент под экран,а не тянем экран под контент.
как сие решить? smile

ayax2005

Дата 17.2.2011, 09:30 (ссылка)

(нет голосов)

Загрузка ...

echo $smile

Профиль
Группа: Участник
Сообщений: 516
Регистрация: 17.4.2008
Где: Питер

Репутация: 3
Всего: 11

Быстренько накидал в файрбаге

Код


<html style="margin: 0pt; padding: 0pt;">
    <head></head>
    <body style="margin: 0pt; padding: 0pt; overflow: hidden;">
        <div id="id1" style="width: 100%; background-color: rgb(255, 0, 0); float: left;">
            header
        </div>
        <div id="id2" style="height: 100%; background-color: rgb(0, 255, 0); float: left; width: 100%;">
            middle
        </div>
        <div id="id3" style="bottom: 0pt; width: 100%; background-color: rgb(0, 0, 255); position: absolute;">
            footer
        </div>
    </body>
</html>

Раз уж вы собираетесь ужимать контент по экрану, то overflow в body не должен вас смущать.

--------------------

все вопросы - из-за неверной формулировки задачи

1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »