<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Codepad: Stick footer</title>
<style>
html {
position: relative;
min-height: 100%;
}
body {
margin-bottom: 60px;
}
.footer {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 60px;
}
</style>
</head>
<body>
<header class="header">
<p>Header text</p>
</header>
<section class="container">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci eum corporis ut iure reprehenderit architecto tenetur sint, praesentium unde tempore.</p>
<p>Animi iste iusto maxime non quia repudiandae ut earum quaerat, assumenda maiores doloremque recusandae enim illum blanditiis aperiam iure, natus?</p>
<p>Nihil recusandae sunt obcaecati numquam. Vero dolore aut repellat veniam, debitis quisquam eligendi rem voluptatum aspernatur nemo, quasi excepturi voluptate.</p>
<p>Unde ducimus placeat deleniti veniam reprehenderit, repellendus fugit quae velit! Velit temporibus repellat dolores hic libero sapiente, aspernatur perspiciatis expedita?</p>
<p>Voluptatum delectus, ab maxime, excepturi unde assumenda officiis adipisci similique quaerat deserunt nostrum dolores possimus iusto veniam repellendus. Suscipit, molestiae!</p>
<p>Repellat accusantium reprehenderit quibusdam asperiores possimus. Maxime, consequatur cupiditate, cumque facere fugit officiis pariatur recusandae culpa neque, libero itaque ducimus?</p>
<p>Quisquam nobis cupiditate blanditiis eius quam magni placeat excepturi ipsa eveniet soluta, illo, porro minima suscipit maiores at reprehenderit molestiae!</p>
<p>Beatae excepturi maxime eum deleniti, hic sed veniam a voluptate aspernatur est ut aut commodi necessitatibus. Eveniet asperiores facilis ullam.</p>
<p>Eos dolore excepturi accusantium voluptate ea repudiandae. Totam fugit quos quo itaque quia aut suscipit facilis molestias! Voluptates, fugit, labore.</p>
<p>Distinctio sequi quis, necessitatibus possimus voluptatem, cum omnis reprehenderit, expedita, adipisci dignissimos quia atque ab quos? Mollitia soluta nemo, repudiandae.</p>
</section>
<footer class="footer">
<p>Footer text</p>
</footer>
</body>
</html>
1 Response
Write a comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.