How to horizontally align social media icons in footer

Hello,

I’m trying to add social media icons to my global footer in a row but when I individually add them they are stacking vertically. I want them horizontal. Thanks!

Hi,

You need to add it in another container then set the container flex layout to row.

I went ahead and added the container.

Please check in your end.

Thanks

Hi,

I managed to sort them horizontally thanks! Is there anyway to make the button shorter in length than the email field?

Hi there,

Please add this custom CSS:

.x-subscribe-form fieldset:last-child {
    width: 25%;
}

.x-subscribe-form {
    display: flex;
    justify-content: center;
}

Thank you. I have one last question. How do I space out the social media icons in my footer equally? You can see the Facebook icon is further away to the others. I want them to all be equally spread apart (same distance as Facebook is to Instagram)

Hi again,

Please add the following code in your Customizer:

.fm6.x-anchor, .fm7.x-anchor, .fm8.x-anchor {
    margin: 0.5em;
    background-color: rgba(255,255,255,0.25);
}

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.