Home › Forums › Design › Background image height problem – not fitting to the screen › Reply To: Background image height problem – not fitting to the screen
I tried the suggested code in the link above but it messes up the background when I view it on my iphone. So I changed it back to the code below which is all good on my laptop and phone but still have a blank section at the bottom of the page on my work PC screen because it’s a different size. I changed the “max width” to the width of the actual image but still squashes the background image…
BODY
{
background-image: url(“photos/background image 1.jpg”);
background-size: 100% 100%;
background-repeat: no-repeat;
}
img.bg {
/* Set rules to fill background */
min-height: 100%;
min-width: 1920px;
/* Set up proportionate scaling */
width: 100%;
height: 100%;
/* Set up positioning */
position: fixed;
top: 0;
left: 0;
}
@media screen and (max-width: 1920px) { /* Specific to this particular image /
img.bg {
left: 50%;
margin-left: -512px; / 50% */
}
}