1. Главная
  2. Форумы
  3. Техподдержка Drupal
  4. Решение проблем

как растянуть сайт на все окно.

Главные вкладки

Аватар пользователя mclighters mclighters 12 декабря 2007 в 13:58

Подскажите пожалуйста как можно растянуть сайт, так чтоб поле footer было всегда внизу броузера, а поле контента максимально растягивалось. Выставлял в CSS свойства на высоту 100% но не помогает. Сколько тем перепробовал везде одно и тоже, если на странице одно два предложения то сайт выглядит отвратительно.

Комментарии

Аватар пользователя PVasili PVasili 12 декабря 2007 в 15:33

2 kuzma - не катит, даже объяснять лень почему Smile
Погуглите немного. Тут : http://xhtml.ru/2005/10/18/footer-stick/ например. Да и вариантов много есть. В новой верстке http://pinchuk.biz/drupal.ru тоже применено, но там случай чуть посложнее Wink

Аватар пользователя UrbanRider UrbanRider 12 декабря 2007 в 16:01

хм зависит как построена page.tpl.php, если на дивах:
слева меню, справа контент, сверху хеадер, снизу футер.
то отдельным дивом создается хеадер, потом создается див, внутри которого первый див - меню флотинг лефт, потом див- контент - флотинг райт, потом закрывается внешний див и создается футер... вот те и конструкция, в css задаете ширину и все... футер вседа снизу, хеадер вседа вверху...

Аватар пользователя UrbanRider UrbanRider 12 декабря 2007 в 18:22

ну незнаю=)
я в основном делаю темы с минимумом графики, только градации цветов бэкграунда, т.к. расчитываю на людей с малой скоростью и у меня проблем не возникает...

Можно пробовать строить страницу на основе "резиновой таблицы" - тоже выход

Аватар пользователя inc inc 12 декабря 2007 в 19:40

Попробуйте такой каркас(шаблон) страницы:

<html>

<body style="margin:0px;">



<table border="0" height="100%" cellSpacing=0 cellPadding=0 width="100%">

<tr>

        <td vAlign="top" align="left" style="width:100%; height:100%;">

                Здесь все, кроме footer'a

        </td>

</tr>

<tr>

        <td vAlign="top" align="left">

                Здесь только footer

        </td>

</tr>

</table>



</body>

</html>

Это надо внедрить в template.php вашей темы оформления.

Аватар пользователя kuzma kuzma 13 декабря 2007 в 13:17

Или такой вариант простого прижатия подвала к низу страницы, который я когда-то увидел на одном из сайтов

<!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" lang="ru" xml:lang="ru">
<head>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Заголовок</title>
<style type="text/css">
* {
 margin:0; padding:0;
 }
html, body {
 height:100%;
 }
body {
 font:62.5%/1.4 Trebuchet MS, sans-serif;
 line-height:100%;
 height:100%;
 }
#main {
 height:100%;
 min-height:100%;
 margin-bottom:-5em;
 }
html>body #main {height:auto;}
#clear {
 clear:both;
 height:5em;
 }
#header, #content, #footer {
 width:100%;
 }
/* заголовок */
#header {
 background:#bcb;
 height:100px;
 }
/* центральная колонка */
#center {
 width:100%;
 }
/* подвал */
#footer {
 background:#bcb;
 height:5em;
 }
.content {
 font-size:1.2em;
 padding:7px;
 }
</style>
</head>
<body>
<div id="main">
 <div id="header">
  <div class="content">Header</div>
 </div>
 <div id="center">
  <div class="content">Content Column</div>
 </div>
 <div id="clear"></div>
</div>
<div id="footer">
 <div class="content">Footer</div>
</div>
</body>
</html>
Аватар пользователя Kolyanuch86 Kolyanuch86 8 декабря 2009 в 14:49

А можно более простым языком, чайнику объяснить куда это писать
У меня если я ставлю 100% все блоки когда сдвигаешь окно съезжаются