[Support request] Centering the footer widgets

Home Forums Support [Support request] Centering the footer widgets

Home Forums Support Centering the footer widgets

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #677435
    chris

    Hello, I have a website where I am using the Peak template. URL is http://www.odonnellsw.com

    In the footer are three footer widgets. When I view the site on a laptop, I noticed that widgets are not really centered, rather, Widget one is aligned with the left edge of the container. I would like all three of these widgets to be positioned in the center of the footer. Can you please tell me the best way to do this?

    Thank you!
    Chris

    #677436
    Leo
    Staff
    Customer Support

    Hi there,

    Try this CSS:

    .footer-widgets {
        text-align: center;
    }

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

    Let me know ๐Ÿ™‚

    #677463
    chris

    Thank you so much for the reply!

    I added the CSS, but now the text itself is centered. I hope I can clarify this: What I want is the text in the widget itself to remain left aligned, but when you look at the page as a whole on a laptop or desktop for instance, the left most widget, where it says Arizona is aligned perfectly with the edge of the container above it. I think it should have more padding or air on the left, and all 3 widgets collectively should also be centered so there is not so much awkward space on the right of the widget 3. Right now, it just looks like all the widgets collectively are sort of pushed to the left. Maybe this is the way it’s supposed to be. I don’t know, I’m open to any suggestions about this.

    #677471
    Leo
    Staff
    Customer Support

    Sorry I’m having a hard time picturing what you mean.

    What if you change the inner container to contained:
    https://docs.generatepress.com/article/footer-layout/#inner-footer-width

    Then play around with padding?
    https://docs.generatepress.com/article/footer-padding/

    Let me know if this helps ๐Ÿ™‚

    #677517
    chris

    So appreciate the rapid response. Thank you! Hoping this screenshot will clarify further what I want to accomplish. http://completerealty.net/p7allegro/img/screenshot1

    Thank you!

    #677518
    chris

    I’m trying to center all three between the guides in this screenshot:

    http://completerealty.net/p7allegro/img/screenshot1

    Thank you!

    #677521
    Leo
    Staff
    Customer Support

    Hmm if you want the footer widget 1 to align with the left side then I guess the only option here is to increase the inner padding of footer widget 2 and 3 with this CSS:

    @media (min-width: 769px) {
        .site-footer .footer-widgets-container .footer-widget-2 .inner-padding {
            padding-left: 60px;
        }
        .site-footer .footer-widgets-container .footer-widget-3 .inner-padding {
            padding-left: 60px;
        }
    }

    You can fine tune the px number.

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