Having a background image that is taller than the page and setting it as the background for the wrapper has caused some issues. Resizing the window results in a large amount of white space under the background image due to the fixed height of the wrapper.
.wrapper{
top: 65px;
background-image: url(img/iasite.png);
background-repeat: no-repeat;
background-size: 100%;
width: 100%;
height: 7250px;
}
Attempts to change the height to 100% or leaving it unset resulted in no background image being displayed. Adding content with a height of 100% caused the background image to be cropped, leaving elements hanging outside. A solution could be setting the wrapper height to match that of the background image so it can dynamically adjust when resized. Is there a way to achieve this or any other solution to this issue? Your assistance is much appreciated.