How can I align footer elements in one horizontal line?

[kaiff]

Hello!

I am looking to align the following elements of my footer in one horizontal line. Please see the attached screenshot. I am using Refresh 12.0.0 as a theme. I am looking to place the subscribe form and social media icons in line with the payment options icons. Policy links should stay in the same place.

Thank you!

[BSS-Commerce]

Hi @kaiff ,

Step 1: Go to Themes/ Edit Code:

Step 2: Add this code to the bottom of the file: global.js and Save

const emailSubcribeEle = document.querySelector("body > div.shopify-section.shopify-section-group-footer-group > footer > div.footer__content-top.page-width > div > .footer-block__newsletter")
const paymentListEle = document.querySelector("body > div.shopify-section.shopify-section-group-footer-group > footer > div.footer__content-bottom .footer__column.footer__column--info .footer__payment")
emailSubcribeEle.after(paymentListEle);

Step 3: Add this code to the bottom of file base.css and Save:

body > div.shopify-section.shopify-section-group-footer-group > footer > div.footer__content-top.page-width > div {
    align-items: center !important;
    gap: 100px !important;
}
@media screen and (max-width: 749px) {
  body > div.shopify-section.shopify-section-group-footer-group > footer > div.footer__content-top.page-width > div {
    gap: 40px !important;
  }
}

• Result:

• Window:

• Mobile:

If it doesn’t work, please share your store link and password. I’ll help you to fix @kaiff