Background image in react only as tall as the div

Question

I'm trying to make a background image in react cover the wohle screen, but everything I've tried so far hasn't worked, from designating the height to be 100% or auto, to having background-size set to cover.

How do I do this? It's a component that's a couple components deep into the app, and should take up the entire screen space. Right now the background image is only as tall as the rest of the page, but I want it to stretch to the bottom of the window.

It works when I designate the pixels, but then I'm designating the pixels and it isn't responsive.

Thank you!

Answer 1

Use vh, vw:

height: 100vh;
width: 100vw;