Add bottom padding to links underneath headers (in footer) without moving underlines

Store Design
, , , , ,

Topic summary

Goal: add 24px bottom padding to footer links while keeping underlines fixed beneath the text.

Context: The request is for a CSS/HTML solution that adjusts spacing without shifting the underline position, likely requiring a styling approach that affects layout but preserves text-decoration placement.

Latest update: A PageFly representative advised adding custom code in theme.liquid (above ) and provided navigation steps (Online Store → Themes → More Actions → Edit code → theme.liquid). However, the referenced code snippet is empty/not visible in the post, so no implementable instructions are available.

Outcome: No working code has been shared; the issue remains unresolved.

Unanswered questions:

  • What specific CSS should be used to create bottom spacing without moving underlines?
  • Should this be applied to link elements directly or via a pseudo-element or wrapper?

Next steps: The responder or community needs to supply the missing code snippet or an explicit CSS solution. The original requester still needs actionable guidance.

Summarized with AI on December 28. AI used: gpt-5.
2

Hi @flammagreg

This is Theodore from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

Hope this can help you solve the issue

Best regards,

Theodore | PageFly