How do I eliminate the white spaces on the left, right, and top of my background image that covers the header area above the fold on my webpage?
I am currently testing in Google Chrome and using VS Code as my editor.
html,
body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
overflow-x: hidden;
}
/*Top part image background blue*/
.image-box {
background-image: url(backgroundtoppart.png);
background-repeat: no-repeat;
height: 100%;
width: 100%;
position: absolute;
background-size: 100% 100%;
z-index: -1;
}
<div class="image-box">Image</div>