Black Friday sale! Get up to 25% off GP Premium! Learn more ➝

[Resolved] Center background image in sections (Mobile)

Home Forums Support [Resolved] Center background image in sections (Mobile)

Home Forums Support Center background image in sections (Mobile)

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #377757


    I tried following the instructions provided in a previous post. However, I can’t get the mobile view to center the images … the CTA are shifted right.


    Previous Thread:


    Lead Developer
    Lead Developer

    Hi there,

    Which images am I looking for specifically?


    Hi Tom,

    The images are in section 1, 3 and 5.

    Section 2 has no image but on mobile view the headings are also not centered – just cuts off. But the text below is centered.

    For section 4 I created 2 rows with columns – 33% Desktop, 50% Tablet, 100% Mobile

    Customer Support

    Hmm I’m not seeing the custom classes or CSS being added to those sections?

    As for the headings getting cut off, it’s likely because all of this CSS being added:

    #H2O_2 {
        box-sizing: border-box;
        color: rgb(238, 238, 238);
        height: 40px;
        text-decoration: none solid rgb(238, 238, 238);
        text-size-adjust: 100%;
        text-transform: uppercase;
        width: 570.667px;
        column-rule-color: rgb(238, 238, 238);
        perspective-origin: 285.333px 20px;
        transform-origin: 285.333px 20px;
        caret-color: rgb(238, 238, 238);
        border: 0px none rgb(238, 238, 238);
        font: normal normal 300 normal 27.2px / 40px "Open sans", sans-serif;
        margin: 20px 0px;
        outline: rgb(238, 238, 238) none 0px;

    I have removed the CSS … the issue with the headings is now resolved.

    I’ve also changed the CTA button … How can I change the link color to white? It’s showing up as blue on the Home Page but on all other pages the Text is White (for both static and hover)

    I’ve tried using this addition, but it did not work:

    #nav {

    Home Page >
    Page where CTA has been changed and the link color is White >

    Regarding the images, I’m not sure which CSS to use

    Customer Support

    Can you follow the HTML and CSS structure here to make the button?

    Just to make sure, you would like to center the background images on mobile? But the focus of those images are actually on the side(s)?


    Hi Leo,

    Thanks! Changing the HTML structure did the trick!

    Regarding the images in the sections, the focus is somehow on the right … can I add css to make the image center and shrink to the screen size?

    Customer Support

    Tom’s method should work. So following the method here:

    To target at mobile only, you would need the media queries CSS here:

    with center center; for the background position as the first link.


    Hi Leo,

    Thanks! I got this bit fixed …

    and created another issue > see the new ticket >

    Customer Support

    No problem!

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