2

Every page on my website seems fine in the following regard except for the homepage:

The background image is set within the outer wrapper to be fixed and to cover the window.

#outerWrapper{
    background-image:url("https://glutenfreeradio.co/assets/img/background.jpg");
    background-position:center center;
    background-size:cover;
    background-attachment:fixed;
    background-repeat:no-repeat;
    position:absolute;
    min-width:100%;
    width:100%;
    min-height:100%;
    z-index:1
}

The problem seems to be less that the background image is misbehaving and more that the outer wrapper is no longer covering the entire window as it used to do. But I can't for the life of me figure out why the outer wrapper is no longer covering the entire window and how to make it do so again.

Stephen Shutters
  • 157
  • 1
  • 6

1 Answers1

2

You should set min-height to 100vh instead of 100%. See here for more information.

Carle B. Navy
  • 1,156
  • 10
  • 28