Question

Hi I have problem with html height.

My height is now set to pixels and everything is okay. But when I put it in percentages it’s not showing:

I need to height to fit my screen too as width do.

Here is the CODE

What I want is to change left and right div’s heights to a percentage to fit the screen.
When I do it my div disappears.

Answer 1

Check out this fiddle. I changed the CSS this way:

html, body 
{ 
 height: 100%; 
 margin: 0; 
 padding: 0 ;
 border: 0 none;
}

#footer
{
clear:both;
text-align:center;
background-color:#4671D5;
 -moz-border-radius-bottomleft: 100px 50px;
  border-bottom-left-radius: 100px 50px;
  -moz-border-radius-bottomright: 100px 50px;
  border-bottom-right-radius: 100px 50px;
}
#left
{
background-color:red;
height:100%;
width:80%;
float:left;
}
#right
{
background-color:blue;
 float:left;
 width:20%;
 margin:0;
  height:100%;
}
#header
 {
 background-color:#4671D5;
 -moz-border-radius-topleft: 100px 50px;
  border-top-left-radius: 100px 50px;
  -moz-border-radius-topright: 100px 50px;
  border-top-right-radius: 100px 50px;
    height: 100%;
 }
 #container
 {
 width:98%;
 padding-left:1%;
 padding-right:1%;
    height: 100%;
 }

It works. 🙂