How to get rid of whitespace at bottom of my page?

Hello! Working on my survey front end project here. Here is the link: https://codepen.io/EdenSweden/pen/MWKRjqP

It looks fine and dandy until I scroll to the very bottom and whitespace suddenly appears, almost as if being pulled up by the nested div containing the survey. Now normally there is a similar amount of whitespace around the entire background image, but I fixed it using negative margins in the CSS of the class .background. But for some reason the negative margin isn’t working for the bottom. I have searched many times on stackoverflow and am stumped. What’s going on here? :face_with_monocle:
(apologies in advance if my code is spaghetti-like.)

hey @EdenSweden,

A body has some margin by default so add margin: 0; to it to get rid of that and then you can remove the margin from the background div too and it should fix your problem :slight_smile:

body {
  margin: 0;
}
1 Like

Oh my goodness, what a lovely and simple solution to a problem that’s been plaguing me for days. You rock. I have lots to learn. :nerd_face:

2 Likes

tell it to go away. it usually works