I'm experiencing an issue where my background moves with the scrollbar, causing the header of the page to scroll along. I've included my code and a screenshot for reference. Any assistance would be greatly appreciated. Thank you.
Here's my code:
body.hixBodyBackground {
overflow: scroll;
margin: 0px;
background: url(../images/common/header/Background_color.png);
background-repeat: repeat-x;
background-attachment: fixed;
background-position: top center;
height: 100%;
width: 100%;
border: 0;
background-size: contain;
filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../KY/images/common/header/Background_color.png', sizingMethod='scale')";
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../KY/images/common/header/Background_color.png', sizingMethod='scale')";
}
body, html{
height: 100%;
padding: 0;
margin: 0;
overflow-y: hidden;
}
Attached is the screenshot illustrating the issue.
Screenshot without scrolling:
Screenshot while scrolling: