How to make <div> take up full screen

How to make <div> take up full screen
0

#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:


#4

haha no probs :smiley: