Separate mobile background changes despite CSS code.

  • Unknown's avatar

    Hello everyone, I recently changed the background of my site, and the mobile version looked weird, so I tried to implement a seperate image for the mobile version. I have created a second image, cropped to size, and used the following code in Additional CSS menu.

    `@media screen and (max-width: 768px) {
    body.custom-background {
    background: url(‘http://allpogo.com/wp-content/uploads/2019/06/NewBGMobile.jpg’) no-repeat fixed;
    }
    }`

    It displays correctly in the WordPress preview of mobile and tablet, but on my actual phone, it flashes the new background for a second before switching back to the full size. I tried adding !Important to the end of the above code as well, didn’t work. Does anyone know what I can do to fix this? Thanks!

    The blog I need help with is: (visible only to logged in users)

  • That’s a fun background! I can’t access the back end of your site though… these forums are for the free sites using our managed hosting service, which can be quite different from running your own WordPress installation at another host.

    Try contacting support for your theme, as that may be your best bet.

    Otherwise, here’s a link to the correct forums for self-managed sites:
    https://wordpress.org/support/forums/

    Good luck!

  • The topic ‘Separate mobile background changes despite CSS code.’ is closed to new replies.