Height and width percentage in css

Height and width are css properties which control the dimensions of a div.

The width in percentage

Let's suppose we have a simple div. we give the width of 100% to this div, by doing this we are saying to the div to take full width of the parent div. So if the parent div is 100 px , our div will be 100px also. As a rule the width is always going UP in the tree.

The height in percentage

With height, things get more complex, if we take a div, and we give it 100%, in this case, even if the parent is 100px, our div won't be 100px, simply because the height doesn't look up the tree but it's value is dynamic, it depends on the children height. If we want to force a given div to take a given percentage, we must give a height to the parent div, we must do that recursivly until the parent.