[MagicPast.NET]#

Linux Windows Софт Hardware Вебмастеру Интернет Сеть C++ Звук Статьи Автомобильные устройства PDA

IP адрес:  54.166.245.10
Версия протокола:  HTTP/1.0
Локальный порт:  55654
Количество кук:  0

Вебмастеру
HTML и World Wide Web
Правила языка html
Структура html-документа
Стандартные шрифты для сайта
Коды символов html
Коды цветов html
Размеры баннеров

HTML5
Отобразить <html> код на Web-странице
Вставить Flash на Web-страницу
Анимированная иконка favicon.ico
Ошибка валидатора: The name attribute is obsolete. Consider putting an id...

CSS3
Атрибут "noshade" с помощью CSS

HTML5, CSS3
Вертикальная линия html
Footer внизу страницы

JavaScript 2.0 (ECMAScript 3.1)
Ротатор баннеров

Meta теги
Атрибут meta charset
Атрибут meta http-equiv
Атрибут meta name

Apache2
Поддомен VirtualHost

Joomla 3.x
Убрать meta-тег "generator"
Вывести текст в позицию шаблона
Разрешить регистрацию пользователей
Убрать "/ru" в имени домена
Вывод габаритных размеров и веса в карточке товара
Убрать строку "Leave the search box empty to find all products, or enter...
Как убрать из <title> VirtueMart надпись "Добро пожаловать в"
Ошибка vmError: Предупреждение, Безопасный путь пустое это...
Предупреждение. Отсутствует флаг ru-RU для языка ru-RU. Пройдите в...
Убрать тег link rel canonical
Вставить баннер в Joomla
Вставить видео YouTube в Joomla
Лента новостей в Joomla
Ускорение загрузки сайта
Убрать мета-тег "Generator"
Добавить позицию в шаблон
Для использования Joomla! на вашем сервере необходимо отключить...

Joomla 2.x
Секреты Joomla
Заменить favicon.ico
Изменить ошибку 404

RSS 2.0
Как создать RSS
Теги RSS


Навигация:   Главная  –  Вебмастеру  –  Footer внизу страницы

Footer внизу страницы

Допустим на вашем сайте имеются счетчики или другая информация, которая должна быть все время в нижней части страницы.

Для такого отображения материала Вам необходимо создать 2 дополнительных DIV. В первый поместить весь контент страницы, а во второй сам футер:

<body>
	<div id="all-content">
		<div class="content">Материал</div>
	</div>

	<div class="footer">Подвал сайта<div>
</body>

Не важно, какие атрибуты Вы будете использовать class или id для блоков.

Теперь создаем стили для блоков div и для тела документа.

html, body
	{
		/*сбрасываем браузер и задаем ему высоту в 100%*/
		margin: 0;
		padding: 0;
		height: 100%;
	}
#all-content
	{
		/*задаем минимальную высоту контента - 100%*/
		min-height: 100%;
	}
.content
	{
		/*Контент, для которого делаем отступ на высоту футера.*/
		padding-bottom: 50px; /*Высота футера, см. ниже.*/
	}
.footer
	{
		height: 50px; /*высота футера*/
		margin-top: -50px; /*Отступ футера, см. ниже*/
	}

Отступ padding-bottom: 50px; для контента, а так же отступ margin-top: -50px; мы делаем на случай, если контент материала велик. Если не дать эти отступы, то футер "наползет" на материал высотой в 50 пикселей.