[Resolved] Scaling BG header images

[David]

(Asking here instead of WP.org per Leo)

First, a brief moment of fan-boy squeeing…

I love this theme. I managed to recreate in GP an entire promo site that previously took over 20 plugins to accomplish, with just GP and Shortcodes Ultimate.

THANK YOU.

The only thing I can’t figure out is how to scale my section background image for mobile devices. On my phone, it shows the upper left portion of an image that is nicely displayed on the desktop version in its entirety.

It’s the top section of the main page of the site (the only page needed on the site, actually). White text, my mug.

Am I missing something stupidly simple?

I thank you again for this amazing product. Purchasing GP Premium was one of the easiest decisions ever.

[Leo]

Hi there,

Give this CSS a shot:

@media (max-width: 768px) {
    #generate-section-1.generate-sections-container {
        background-position: center right;
    }
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

You can also try center center; or fine tune it with px or %:
https://docs.generatepress.com/article/backgrounds-overview/#position

Let me know if this helps 🙂

[David]

That code, with center center worked like a charm.

I have two other questions, but I won’t hijack the thread.

Thank you!!

[Leo]

No problem 🙂

[Author]

Posts