Layout language preferences button footer design

Store Design
, ,

Topic summary

A user is seeking help with custom CSS code for centering language preference buttons in their store’s footer. The current implementation has resulted in the two language selection boxes appearing attached to each other without spacing.

Issue Details:

  • Language preference boxes are centered but lack spacing between them
  • Problem appears specifically in mobile view
  • User wants to add a small gap between the elements

Proposed Solution:
A PageFly support representative suggests modifying the base.css file by adding CSS targeting the localization form with padding adjustments using a media query for screens up to 767px width. The solution involves editing the theme code through: Online Store → Theme → Edit code → Assets → base.css.

The discussion remains open, awaiting confirmation whether the suggested CSS fix resolves the spacing issue.

Summarized with AI on November 21. AI used: claude-sonnet-4-5-20250929.
1

Hi there,

I added some custom code to my page to center the language preferences in the footer of my page. However, the two boxes are now attached to eachother and I would like to have just a little bit of space between them. In MOBILE VIEW only.

https://taneraskin.com/

Best,
Isa

2

Hi @isabellemaria

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

@media(max-width: 767px) {
.localization-form:only-child {
    padding: 1rem 5px !important;
}
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

1 Like