mobile background image not correctly formatted on actual mobile

  • I have an issue when loading the website on mobile, when i view it on the wordpress mobile simulator view it looks fine, but when i load it on an actual phone the background image is far too large and as such low quality. i don’t think the problem is my phone as my boss has the problem when looking at the site too. any one know what i can do?

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi xanthicchimera

    Thanks for getting in touch with us.

    Please try the following CSS code in custom CSS field (Appearance -> Customize -> Header settings -> Custom CSS).

    @media (max-width: 500px) {
    body.custom-background {
        background-size: contain;
        background-repeat: repeat;
    }
}

    Let me know if works..!

    Thanks

    Thread Starter xanthicchimera

    (@xanthicchimera)

    Hi, @shahidmansuri123 thanks it fixed the main problem but now its repeating the background image, which is an improvement but ideally i want it to fill to the screen once without being so zoomed in.

    Hi xanthicchimera

    Sorry for the inconvenience.

    But, that was the final solution as above given by me. And there is no other solution to do it. If you want to show the background image on the whole body area in the mobile devices, so you need to keep the current CSS of the theme.

    You can also check the responsive background image example: https://www.webfx.com/blog/web-design/responsive-background-image/

    Thank You.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘mobile background image not correctly formatted on actual mobile’ is closed to new replies.