CODEWITHSUNDEEP
htmlcss
Chiggins
Chiggins

Reputation: 8397

Center and pin to bottom of parent

Hey all, quick question regarding CSS. On my website, I'd like it if the navbar was centered, and pinned to the bottom of the header (the bottom of the gradient). I cannot figure out how to do this.

The site doesn't support IE... Yet.

Upvotes: 0

Views: 414

Answers (2)

Shaoz
Shaoz

Reputation: 10653

Make your 'header' tag as a relative position. Then make the 'nav' tag as an absolute position, and do 'bottom: 0' to it. All in your CSS. And it should work. Then move it left or/and right, using the 'left' and 'right' rules in css.

Like this:

header {
position: relative;
zoom: 1; /*needed to clear float in IE*/
}

header:after {
clear: both;
display: block;
content: " ";
visibility: hidden;
height: 0;
}

nav {
position: absolute;
bottom: 0;
}

Upvotes: 1

MRR0GERS
MRR0GERS

Reputation: 654

Try setting your header to a relative position and your nav to absolute instead of relative.

Upvotes: 0

Related Questions