Skip to content

Instantly share code, notes, and snippets.

@Haosvit
Last active September 14, 2017 14:18
Show Gist options
  • Select an option

  • Save Haosvit/a8943eb84a4d4e26a4b16f994f12fce2 to your computer and use it in GitHub Desktop.

Select an option

Save Haosvit/a8943eb84a4d4e26a4b16f994f12fce2 to your computer and use it in GitHub Desktop.
Sticky footer: footer sticks to content or bottom of the page.
html, body {
height: 100%;
}
body {
padding-bottom: 200px;
overflow: auto;
}
.PageContent {
min-height: 100%;
}
.footer {
width: 100%;
position: relative;
height: 200px;
clear: both;
}
.footer:before {
content: "";
float: left;
}
<html>
<body>
<div class="PageContent">
<!-- Page content -->
</div>
<div class="Footer">
<!-- Footer -->
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment