Mobile background is fine on menu but distorts on home?

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: