Имя пользователя:
Пароль:  
Помощь | Регистрация | Забыли пароль?  | Правила  

Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » [решено] Растягивать div по всей оставшейся высоте страницы

Ответить
Настройки темы
[решено] Растягивать div по всей оставшейся высоте страницы

Аватара для Artem-Samsung

Ветеран


Сообщения: 823
Благодарности: 53

Профиль | Сайт | Отправить PM | Цитировать



Помогите сверстать.
Сложность в том, как сделать, что бы не прикрепить футтер вниз страницы, а блок div по центру должен быть растянутым физически так как там будет скролл.

Эфект должен быть схожим с вот этим:

HTML код: Выделить весь код
<table style="height:100%" width="100%" border="0"> <tr> <td style="height:200px;">Шапка</td> </tr> <tr> <td>Текст</td> </tr> <tr> <td style="height:100px;">Низ сайта</td> </tr> </table>

-------
Мой блог Web Development


Отправлено: 18:00, 07-11-2011

 

Аватара для PC_Maniac

Новый участник


Сообщения: 20
Благодарности: 4

Профиль | Отправить PM | Цитировать


Если я правильно понял нужно что то вроде этого:
В css -
Код: Выделить весь код
#wrapper {width: 100%; height: 100%;}
#top {width: 100%;height: 200px;}
#main {width: 100%;height: 100%;}
#bottom {width: 100%;	height: 100px;}
На страницу -
Код: Выделить весь код
<div id="wrapper">

    <div id="top"></div>
    <div id="main"></div>
    <div id="bottom"></div>

</div>

Отправлено: 11:41, 24-11-2011 | #2



Для отключения данного рекламного блока вам необходимо зарегистрироваться или войти с учетной записью социальной сети.

Если же вы забыли свой пароль на форуме, то воспользуйтесь данной ссылкой для восстановления пароля.


Аватара для Artem-Samsung

Ветеран


Сообщения: 823
Благодарности: 53

Профиль | Сайт | Отправить PM | Цитировать


Мне подошло вот такое вот решение:

Код: Выделить весь код
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
        <style>
        *{padding:0px;margin:0px;}
        html,body{height:100%;overflow:hidden;}
        .body{position:absolute;left:0px;right:0px;top:0px;height:100%;overflow:hidden;}
        .top{position:absolute;left:0px;right:0px;top:0px;height:200px;background:#bbb;z-
index:2;}
        .content{position:absolute;left:0px;right:0px;top:200px;bottom:100px;background:#eee;
overflow:auto;z-index:1;}
        .bottom{position:absolute;left:0px;right:0px;bottom:0px;height:100px;background:#999;
z-index:2;}
        </style>
</head>
<body>
        <div class="body">
                <div class="top">top</div>
                <div class="content">content</div>
                <div class="bottom">bottom</div>
        </div>
</body>
http://jsfiddle.net/artemhp/tCzZt/

-------
Мой блог Web Development

Это сообщение посчитали полезным следующие участники:

Отправлено: 13:17, 01-12-2011 | #3



Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » [решено] Растягивать div по всей оставшейся высоте страницы

Участник сейчас на форуме Участник сейчас на форуме Участник вне форума Участник вне форума Автор темы Автор темы Шапка темы Сообщение прикреплено

Похожие темы
Название темы Автор Информация о форуме Ответов Последнее сообщение
Интерфейс - У программы окно не меняет размер по высоте (по ширине изменяется) llVKll Microsoft Windows 7 5 24-12-2010 10:03
как отцентрировать содержимое DIV по высоте (форму поиска) koresaram Вебмастеру 6 08-02-2010 18:04
разгон всей системы benwar Разгон, охлаждение и моддинг 4 28-10-2009 01:11
Интернет - Internet Explorer 6.0 sp2. Как указать печать адреса страницы при печати страницы. GifuN Microsoft Windows 2000/XP 1 11-11-2008 08:29
как включить вертикальный скролл, если страница 100% по высоте? rizz Вебмастеру 4 21-05-2008 11:01




 
Переход