VPF::div внизу страницы - Форум программистов

transat

Дата 10.12.2009, 04:35 (ссылка)

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

Загрузка ...

Шустрый

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

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

такая структура:
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>

Нужно чтобы слой footer всегда прижимался книзу страницы не зависимо от того есть ли текст в слое #body или нет. Если центр пустой либо заполнен не во всю высоту то бегунка не должно быть и footer должен быть внизу, а если текста больше чем высота окна то должен появляться бегунок соответственно и footer по прежнему должен быть внизу. position absolute не подходит т.к. footer будет внизу только когда отсутствует наполнение. если появляется бегунок то текст проходит под footerом а footerне двигается с места. Есть вообще решение данной проблемы?

FortMax

Дата 10.12.2009, 04:43 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 485
Регистрация: 2.10.2006
Где: Россия, г. Бироби джан ЕАО

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

Цитата(transat @ 10.12.2009, 04:35

)

footer будет внизу только когда отсутствует наполнение. если появляется бегунок то текст проходит под footerом а footerне двигается с места. Есть вообще решение данной проблемы?

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

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

transat

Дата 10.12.2009, 04:57 (ссылка)

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

Загрузка ...

Шустрый

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

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

есть футер высотой 70px. Если в боди текста много то он пройдет под футером а футер уже не будет внизу при прокрутке. вот этого и нужно как-то избежать. т.е. футер поднимается выше при прокрутке и страничка заканчивается текстом а не футером

FortMax

Дата 10.12.2009, 05:08 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 485
Регистрация: 2.10.2006
Где: Россия, г. Бироби джан ЕАО

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

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

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

bars80080

Дата 10.12.2009, 11:18 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

судя по всему он это хочет http://www.alexilin.ru/5-sovetov-po-html-i-css/

transat

Дата 10.12.2009, 14:05 (ссылка)

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

Загрузка ...

Шустрый

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

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

Цитата(bars80080 @ 10.12.2009, 11:18)

судя по всему он это хочет http://www.alexilin.ru/5-sovetov-po-html-i-css/

сделал как написано и все равно не так как нужно. если в #body пусто, то footer улетает наверх к #body. а нужно чтобы всегда был внизу

bars80080

Дата 10.12.2009, 15:41 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

что-то вы делаете не так. от #body это не должно зависеть никак

Код


<html>
   <body>
      <div id="content">
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>
         <div id="before_footer"></div>
      </div>
      <div id="footer"></div>
   </body>
</html>

Код


html {height:100%}
body {height:100%}
#content { min-height:100%; }
#footer { height: 40px; margin-top:-40px; position:relative; }
#before_footer { height:40px; clear:both; }
* html #content { height: 100%; }

у вас так или иначе?

transat

Дата 10.12.2009, 15:46 (ссылка)

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

Загрузка ...

Шустрый

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

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

html вот такой если без внутренностей

<html>
   <body>
       <div id="header"></div>
       <div id="body">
           <div id="before_footer"></div>
      </div>
      <div id="footer"></div>
   </body>
</html>

bars80080

Дата 10.12.2009, 15:49 (ссылка)

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

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

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

видать у вас какие-то внутренности шибко активные. они вероятно и сносят нужные стили

transat

Дата 10.12.2009, 15:54 (ссылка)

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

Загрузка ...

Шустрый

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

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

Попробую сделать без внутряков. Если заработает то буду искать ошибку внутри

transat

Дата 10.12.2009, 19:41 (ссылка)

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

Загрузка ...

Шустрый

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

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

Переписал все без внутренностей. Все дело походу в #header. он у меня 120px в высоту. а у #body раз стоит min-height:100% то при отсутствии текста в #body #footer съезжает вниз еще на 120px. Как этого избежать?

transat

Дата 11.12.2009, 00:21 (ссылка)

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

Загрузка ...

Шустрый

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

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

Додумался уже сам smile

опытным путем.

transat

Дата 11.12.2009, 00:38 (ссылка)

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

Загрузка ...

Шустрый

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

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

Рано обрадовался smile

Если вставляю длинный текст или полностью убираю его то все прекрасно. а если вставляю чуток текста то сразу появляется бегунок. Притом только если вставляю блочные элементы вроде <p>. если просто текст то все норм. Как это исправить пока не придумал

Это сообщение отредактировал(а) transat - 11.12.2009, 00:40

Mavrun

Дата 20.12.2009, 12:35 (ссылка)

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

Загрузка ...

Бывалый

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

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

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

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