CODEWITHSUNDEEP
csshtml
pcproff
pcproff

Reputation: 622

Center content div not at 100% height

This is my first attempt at anything with the <header>,<footer> elements in HTML5. Usually in XHTML I would have the div that was the footer inside of the container <div> and the center would expand all the way down with clear:both.

I am trying a 100% width template here and I am not getting the center area at 100% height. Can you guys see anything wrong with this?

The code is at: http://www.designinipad.com/html5test.html

or at:

https://gist.github.com/1524774

Thanks!

Upvotes: 1

Views: 288

Answers (2)

Rob
Rob

Reputation: 15168

Whatever you did using the div element in the past will work identically using the header and footer elements. Like the div, these are just container elements and behave the same way.

Upvotes: 1

dangerChihuahua007
dangerChihuahua007

Reputation: 20915

If you set the height of container, body and html to be 100%, it should work:

body, html {
    height: 100%;
}

This question should be helpful: Make div 100% height of browser window

My only concern is that assigning a height to < html > and < body > does not seem to be standards compliant.

Could you work around it? Perhaps assign a min-height to the < div > with id container around 700px to push it down?

#container {
    min-height: 700px;
}

Upvotes: 0

Related Questions