How to make <div> take up full screen

HTML-CSS
#1

Hey there,

I’m trying to get the different “#top-section” div section of my page take up full screen when in view, but can’t seem to make it work.

I tried the CSS “height: 100%” as well as “background-size: cover” but they don’t seem to be working.

Any ideas on how to do this? codepen below:

Thanks!

#2 
#top-section {
 min-height: 100vh;
}

vh, being % vertical height of the view port (Viewport Height)

remove your existing height property first.

Cheers

#3

Wohoo! That totally worked, thanks :slight_smile:

2 Likes
#4

haha no probs :smiley:

#5