[Support request] Header Photos Optimized for Mobile

[Colton]

Hey GP,

My header photos that are merged with the primary navigation don’t seem to shrink down on a mobile phone. The photo stays large unlike all the other photos that can be see in their entirety. How do I adjust them?

my site is coltsimmons.com

Thanks!

[Leo]

Hi there,

Unfortunately background images are not responsive by nature unlike static images.

You can try replacing it specifically for mobile like this:

@media (max-width: 768px) {
    .generate-content-header {
        background-image: url(https://URL-HERE);
    }
}

Let me know if this helps.

[Colton]

Where would I enter this code?

[Tom]

This should help: https://docs.generatepress.com/article/adding-css/

[Author]

Posts