lukeseager
lukeseager

Reputation: 2615

Div will not go 100% height with CSS

I know this question has been asked a lot, and I'm used to making a div fill 100% of the window height using CSS, however, with the specific code I'm using here, I can't seem to get the .entry-header element to fill 100% of the visible height of the window, despite it's parent article being able to do so with the exact same code.

I have a pen showing the HTML/CSS I have so far: http://codepen.io/anon/pen/JBbCu

I wish to get the .entry-header element to fill the height of the screen, with the .entry-overlay element sitting at the bottom of it, followed by the content of the article below the fold.

Can anyone spot where I'm going wrong here?

Upvotes: 0

Views: 314

Answers (1)

brandelizer
brandelizer

Reputation: 352

you have to do:

article {
    background: none repeat scroll 0 0 red;
    clear: both;
    display: block;
    float: left;
    height: 100%;
    width: 100%;
}

Upvotes: 1

Related Questions