[Resolved] Footer Bar Widgets not center in line

Home Forums Support Footer Bar Widgets not center in line

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1304790
    Elzanne

    Hi there.

    I have two widgets in the footer bar:

    1 image widget that I want to display in the dead center of the footer bar
    and 1 navigation menu widget that I want to display on the right side

    I want to copyright to stay on the left side, which it automatically does as it is not a widget.

    How do I center center the image widget in te footer bar, and also align the navigation to it.

    If I center alight the footer bar in the customizer, it just places it beneath each other in the center.

    I have used the following css:

    .footer-bar > .widget {
    display: inline-block;
    margin: 0 10px;
    }

    Thank you.

    #1304887
    David
    Staff
    Customer Support

    Hi there,

    hmmm… you could try this CSS:

    @media(min-width: 1200px) {
        .site-info {
            position: relative;
        }
        .footer-bar {
            display: flex;
        }
        .footer-bar > .widget.widget_media_image {
            position: absolute;
            left: 50%;
            transform: translateX(-50%); 
            top: 0;
        }
    }

    It only works on 1200px+ screens as there isn’t enough room for all three in a line otherwise.

    #1305875
    Elzanne

    Thank you so much David. It’s perfect now! 🙂

    #1306035
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.