[Resolved] Adjust Section Background image on mobile device

Home Forums Support [Resolved] Adjust Section Background image on mobile device

Home Forums Support Adjust Section Background image on mobile device

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #574116
    Stacey

    Hi

    Can you help me with what to target to adjust the background image (in a section) on the home page of this site http://smehr.swish-client.com/ for a media query for mobile devices. I’ll probably just hide the image.

    Thank you

    #574127
    David
    Staff
    Customer Support

    Hi Stacy,

    each of the sections are given a unique ID named in numerical order so first is #generate-section-1 and to target that section background image would be done like so:

    @media (max-width: 320px) {
        #generate-section-1.generate-sections-container {
            your styles here
        }
    }

    I notice you have text in the image, you may want to try adding the background image without this text. And adding the text in the content, that way it will be mobile responsive. You can do the same (and a lot more) if you use a GP PageHeader which maybe something you wish to check out.

    #574128
    Stacey

    Thanks – I’ll try the page header instead – I was thinking that I needed a section because I only want it on the home page but remember now that I can specify page headers for individual pages. I’m still exploring all the options with GeneratePress.

    #574137
    Stacey

    That worked now! Thank you for the suggestion

    #574371
    David
    Staff
    Customer Support

    Glad i could help Stacey

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.