fixed bottom footer

by kulbhushan charaya

HTML

<body>
<header>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">link1</a></li>
<li><a href="#">link2</a></li>
<li><a href="#">link3</a></li>
<li><a href="#">link4</a></li>
</ul>
</header>
<div class="wrapper">
<div class="demo">
<h1> H1</h1>
<h2> h2</h2>
<h3> h3</h3>
<h4> h4</h4>
<h5> h5</h5>
<h6> h6</h6>
<hr>
<h1> H1</h1>
<h2> h2</h2>
<h3> h3</h3>
<h4> h4</h4>
<h5> h5</h5>
<h6> h6</h6>
<hr>
<h1> H1</h1>
<h2> h2</h2>
<h3> h3</h3>
<h4> h4</h4>
<h5> h5</h5>
<h6> h6</h6>
</div>
</div>
<footer>
	<h1>kulbhushan charaya</h1>
</footer>
</body>

CSS

body {
    background: #ffffff none repeat scroll 0 0;
    padding:40px 0;
}
header{
  position:fixed;
  top:0;
  z-index:999;
  left:0;
  width:100%;
  background:#fff;
  border-bottom:1px solid #ccc;
}
header ul li {
  display: inline-block;
  list-style: outside none none;
  padding: 5px;
}
header ul li a {
    color: #000000;
    text-decoration: none;
}
footer {
  bottom: 0;
  left: 0;
  position: fixed;
  text-align: center;
  width: 100%;
  z-index: -1;
}
footer h1 {
  margin: 0;
}
.wrapper {
  background: #ffffff;
  padding: 0 15px;
  z-index: 1;
}