Mobile background is fine on menu but distorts on home?

Highlighted
New Member
1 0 0

Hey Everyone,

 

Basically on a mobile my background zooms in on the home page but is fine on the menu page- is there a code that can fix this, as obviously it can work but not on this page?

 

Currently the code is this:


body, html{
background-image: url({{ 'background.jpg' | asset_url }});
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover
}

 

Have tried changing to contain and adding an media only code but nothing appears to have worked!

Added images as reference:

 

IMG_5302.PNGIMG_5303.PNG

0 Likes