CODEWITHSUNDEEP
htmlcssheightstylesheet
TruMan1
TruMan1

Reputation: 36058

How to make div work for 100% height and not only for iframe?

I have a layout with a 100% height for the content area. The problem is that it makes an iframe work perfectly for 100% height, but I cannot get it to work for a regular div. Is there a way to make the height 100% for the div? The white area should be filled with a black area but it does not. Any help would be greatly appreciated.

http://jsfiddle.net/mp8nr/1/

enter image description here

Upvotes: 1

Views: 150

Answers (4)

bart s
bart s

Reputation: 5100

Set your inner-content class to 

height: 100%;

Upvotes: 1

Guffa
Guffa

Reputation: 700152

You have to set the parent element height also:

<section role="main" id="content">
  <div class="inner-content" style="height: 100%">

(This should of course go in the style sheet somehow... You use the class for other elements in the page, that's why I didn't put it there...)

Upvotes: 0

laurent
laurent

Reputation: 90736

It would work if you set the height of .inner-content to 100% too:

.inner-content {
    margin-bottom: -109px;
    padding-top: 109px;
    height: 100%;
}

Upvotes: 2

Mesh
Mesh

Reputation: 6422

Using position:absolute

http://jsfiddle.net/adrianjmartin/mp8nr/27/

Upvotes: 0

Related Questions