CSS Layout - Most popular layouts and patterns that can be built with CSS | Product Hunt Embed
.home
~
.explore

Sticky footer

The footer always sticks to the bottom if the main content is short.
<div style="
    display: flex;
    flex-direction: column;
    height: 100%;
">
    <header style="flex-shrink: 0;">
        ...
    </header>
    <main style="flex-grow: 1;">
        ...
    </main>
    <footer style="flex-shrink: 0;">
        ...
    </footer>
</div>
Subscribe to the newsletter for the latest layouts or patterns. No spam. Ever!