Having an overarching background image ( covering header to footer )

Hi, I’ve got a few background images that I’d like to use as backgrounds for various screens/views I have.

I started trying with one.

When I add this


to the style.css, I can see that pink is only take effect on in between the header and footer which are both sticky!

How can I make sure that the background also shows thru the header and footer too?

Of course, one can pass the pink CSS instruction for both header and footer but this trick would only save the day for the background-color. Eventually, I would use background-image