White space below modal on mobile devices

Question

I have a popup modal with a form in it that displays properly on desktop browsers. On mobile devices, it fills up the entire screen, but reveals a white space below after the content ends. When you scroll back up, the white space blocks some of the content. I can't inspect this element and don't see it in the document outline.

It looks something like this:

How can I remove the blank space?

Answer 1

Perhaps it is an issue for Clearfix?

See: http://www.jqui.net/tips-tricks/css-clearfix/

Answer 2

Preventing the body from being scrollable when the modal is open on mobile devices solved the problem.

@media screen and (max-device-width: 600px) {
  body.modal-open {
    overflow: hidden;
  }
}