Как закрепить футер внизу экрана для DLE

Как закрепить футер внизу экрана

Часто встречаются мне подобные вопросы. Но так же в интернете не мало примеров реализации данной задачи.
Что ж, я тоже добавлю один вариант :)
Но моя реализация подходит только для футеров с фиксированной высотой. Хотя насколько мне известно, почти все футеры делаются с фиксированной высотой.

Проверить работу можно на демо странице

<!DOCTYPE html>
<html>
<head>
<style>
*{padding:0;margin:0;}
body{background:#f0f0f0;}
.wrapper, .footer-content{width:1000px;}
.wrapper{
  margin:0 auto 70px;

  background:#fff;
  height:1000px;
}
.footer{
  position:fixed;
  top:100%;
  left:0;
  width:100%;
  height:50px;
  margin-top:-50px;

  background:#444;
}
.footer-content{
  margin:0 auto;
  text-align:center;
  color:#fff;
  line-height:50px;
}
</style>
</head>
<body>
<div class="wrapper">
	тут ваш контент
</div>

<div class="footer">
	<div class="footer-content">
		тут футер
	</div>
</div>
</body>
</html>


Оформление сделал для наглядности видимости блоков.

С уважением,
Олег Александрович a.k.a. Sander
Добавить комментарий

Внимание! Все сообщения касающиеся техподдержки будут удалены или проигнорированы

Attention! All messages asking for technical support will be removed or ignored

  • Логин
  • E-mail (не обязательно)
Повторите рисунок:
antibot
© Sander-Development. 2009-2024.
При копировании, ссылка на источник обязательна.