Home>Support>Background Image Appearance on Mobile CSS

Background Image Appearance on Mobile CSS

Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

Hey Guys!

I’m using SiteOrigin Unwind theme and have set my website to have a background image on all of the pages, with a different background image just on the Home Page. All backgrounds looked great on desktop, but are oversized and pixelated on mobile.

I’ve managed to target and adjust the Home Page background appearance on mobile using CSS and the page id to target it;
@media screen and (max-width: 768px) {
.page-id-37 {
background-image: url

But I’m unsure how to target all of the other remaining pages (without having to do so individually) and apply the same changes to the other background. Apologies it’s a bit hard to put into words, but if you view my website on mobile you’ll see a big difference in how the background scaling looks between the Home Page and other pages;

Home

I’ve tried lots of different things but have had no luck so far – any ideas?

Thank you,
Rachel

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 4 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi Rachel

    Thanks for reaching out.

    When you target .page-id-37 you’re targeting the body tag, you’re just using a class name in that tag to make your rule specific to a page. Assuming there is one background image you can use for all pages for mobile you could target all other pages using the body tag.

    body {
    }
    
  2. 4 years, 3 months ago RachelWeaver

    Thanks heaps Andrew you’re a legend! I did try body at some point but must have had it in the wrong spot or put a dot in front of it or something. It’s working now, very happy :)

    Thanks again!
    Rachel

  3. 4 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi Rachel

    Thanks for the update. We’re glad to hear you’re making progress. All the best with your website.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More