Home/ Questions/Q 222011
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-11T19:05:14+00:00

This is probably a very dummy question, don’t throw your shoes at me :)

  • 0

This is probably a very dummy question, don’t throw your shoes at me 🙂

Consider having HTML like this:

<div class="container">
    <div class="header">
    </div>
    <div class="body">
    </div>
    <div class="footer">
    </div>
</div>

I want ‘header’ and ‘footer’ to be anchored to the parent’s top and bottom respectively, and ‘body’ to grow easily to fit all available space.
What would the CSS look like to achieve this?

EDIT: Maybe I’m saying this wrong (i’m not exactly a web developer 🙂 ), but what I need is to have some part of a div always attached to its bottom. So when div grows this part (which might have a fixed size) would go lower with the div’s lower end. But all this doesn’t mean attaching a div to the bottom of browser’s window.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If I understand your question correctly, you require some really basic css.

    body { background: black; }
.container { width: 960px; }
.header { height: 100px; background: #ddd; }
.content { padding: 10px; }
.footer { height: 100px; background: #ddd; }

    Your div’s are not floated, so will stack on top of each other like pancakes.

    If you want the footer to be “sticky”, see here for a solution…
    http://ryanfait.com/sticky-footer/

    • 0