100% height?, How to make the height of a div 100% Options

[kyle246]

I am trying to get my div container (my left side bar) to have a height of 100% so that it will fill up its parent container.

Here is the css code for my parent container (I am also using clearfix so it expands)

CODE

#boxicreated{
    height:100%;
    border:1px #000 solid;
}

Here is the css code for the child container which is my left side bar

CODE

#primary {
    width:190px; /*+10px padding*/
    float:left;
    margin-left:-800px;
    padding:0 10px 0 0;
    background:#eaeaea;
    min-height:100%;
    height:100%;
}

I made a black 1px border around my parent div so you can easily see it. My child container is the left sidebar which has a light grey background. I want that child container to expand downwards until it hits the end of its parent container..

The website is "pokemonsocial.com" (currently this is only on the home page.)

Any help would be awesome.

Thanks,
Kyle

[pandy]

Is #boxicreated the correct height? Of what is it 100%?

[kyle246]

I created the #boxicreated just so I could try to make my child container expand its height to 100% of the parent container.

The 100% on the #boxicreated is there because I read somewhere online that it might work but it didn't. The #boxicreated would display the same with or without the 100% height.

[Christian J]

All parents need a height in percent, until you either reach the root element (HTML) or a parent with an absolute height value. For example:

CODE

html, body, #boxicreated {height: 100%;}

or

CODE

body {height: 200px;}

#boxicreated {height: 100%;}

[kyle246]

i kinda fixed the problem. thanks for everyones help