[Resolved] Section: Background image not centered

Home Forums Support Section: Background image not centered

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #366698
    Roland

    Hi there,

    I made a section without content but with a background image, a parallax, box type: full width, inner type: full width, padding: 50%.

    My question: When I publish the page, everything works fine, but the image is not centered. It’s pushed to the right. How can I solve this? I wished the image would automatically fit entirely in the space between left and right border of the browser.

    Are there any recommendations for the size of the background image? The mine is 3648 × 1635.

    Sorry, I can’t link to the page because it’s maintenance mode.

    Kind regards
    Roland

    GeneratePress 1.4
    GP Premium 1.4.2
    #366744
    Leo
    Staff
    Customer Support

    Hi there,

    If you want a section with only the image then I would recommend adding the image as the content instead of the using it as a background image. It would be better for responsive purpose as well.

    Let me know if this works for you.

    #366760
    David
    Staff
    Customer Support

    If you do want to center the section background image you can give the section a Custom class e.g db-bg and then add the following CSS. I use the Simple CSS plugin so you will have this Meta box on the page you are editing.

    .db-bg {
    background-position: center;
    }

    Your image size is overkill – just make it big enough to fill the biggest page you are using.

    #366770
    Roland

    Hi there,


    @Leo
    : Thank you for your reply. But adding the image as the content doesn’t really work. Okay, it’s centered. But I have paddings that I don’t want and there is no parallax.


    @David
    : Thank you, works fine! 🙂

    #366780
    Leo
    Staff
    Customer Support
    #366781
    David
    Staff
    Customer Support

    Your welcome Roland. Good timing – took a 5 minute break from styling a 10 section page, which included just that!

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