Full Stack LAMP - MEAN Developer, Python developer. Certified Azure Developer. Freelance programmer/consultant/trainer.

This tutorial will show you how to set 100% full height div with CSS with simple lines.

The percentage (%) is a relative unit so the resulting height depends on the height of parent element’s height.
So we must set HTML and body elements height to 100%, so the resulting height of container div becomes equal the 100% height of the browser window.

html, body {
  height: 100%;
}

After that, set the full 100% height to your container(which you want 100% height)

div.content {
  height: 100%;
}

Your final complete code would look like this :


    
    
    
    Set DIV Height to 100% Using CSS
    
    
    
        
The height of this DIV element is equal to the 100% height of its parent element's height.

Leave a Reply