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

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

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

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

<!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