[Resolved] center footer with one widget

Home Forums Support center footer with one widget

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #948949
    Eva

    Hi,
    There are many topics about centering the footer widget, but I just can’t find what I am looking for. I am using 1 footer widget and want to center it (not the text!).
    The footer is full width, inside and outside (2000 px)
    Footer Widget Area Padding: 10, 300, 10, 300
    And I added some extra css:
    .footer-widgets {
    width:100%;
    text-align:left;
    }


    @media
    (max-width: 768px) {
    .footer-widgets {
    padding: 20px;
    }
    }

    Still it’s not centered, the footer-bar is.
    The site is in maintenance mode, so unfortunately I can’t show it…

    Any ideas?
    Thanks for the support!
    Eva

    #949088
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can link us to the site in question?

    You can edit the original topic and use the private URL field.

    Let me know 🙂

    #949672
    Eva

    Hi Leo,
    At the moment I can’t send you a link because the site is in maintenance mode. But I think I will put it online soon, and adjust the footer later. I send you a message again when it can be seen, ok?

    Thanks,
    Eva

    #949912
    Leo
    Staff
    Customer Support

    Yup just add the link in the topic when it’s live and comment here again 🙂

    #952244
    Eva

    Hey Leo, just added the link…
    Thanks!

    #952252
    Leo
    Staff
    Customer Support

    Replace this existing CSS:

    .footer-widgets {
        width: 100%;
        text-align: left;
    }

    With this:

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

    Let me know 🙂

    #952404
    Eva

    Hey Leo,

    This centers the text, I just want to center the whole widget and align the text left…

    #952418
    Leo
    Staff
    Customer Support

    Sorry I’m a bit confused.

    The widget itself should be centered by default without adding any CSS as seen here:
    https://www.screencast.com/t/skalt339CGGm

    Am I missing something here?

    Let me know 🙂

    #952671
    Eva

    What I mean is that I would like the footer widget to line with the footer text (https://prnt.sc/oci0d0 here in the red box) and then line the text left… But if that’s not possible, ok…

    #952873
    David
    Staff
    Customer Support

    Hi there,

    remove the current CSS that is aligning the text and then try this:

    .inside-footer-widgets {
        display: flex;
        justify-content: center;
    }
    
    .inside-footer-widgets > div {
        flex-basis: 620px;
    }

    The flex-basis property sets the optimum width of the widget – adjust this to suit your alignment requirements.

    #953314
    Eva

    Great David, it works!!
    Thank you very much.

    #953317
    David
    Staff
    Customer Support

    Glad to hear that 🙂

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