CODEWITHSUNDEEP
css
devyn
devyn

Reputation: 17435

Creating vertical space in CSS

So, I've got a box in the center of the page (vertically and horizontally) with a fixed height (200px)

It contains two elements, of arbitrary height. I want one to be anchored to the top, and one to be anchored to the bottom of the box.

CSS3 is fine for this, so please use it if the stylesheet is clearer.

Upvotes: 1

Views: 3384

Answers (1)

Evan Nagle
Evan Nagle

Reputation: 5133

The html:

   <div id="outer">
        <div class="top">
        </div>

        <div class="bottom">
        </div>
    </div>

The styling:

#outer {
    width:100px; /* whatever */
    height: 200px;
    position:relative;
}

.top {
    position:absolute;
    top:0px;
}

.bottom {
    position:absolute;
    bottom:0px;
}

Upvotes: 4

Related Questions