Need Help to make the slide banner did not have so much spacing in a mobile version ?

Shopify Discussion

Topic summary

A Shopify store owner using the Empire 11.13 theme is experiencing excessive vertical spacing around their mobile banner and needs help reducing it. They also want to adjust an icon list section to display in a single horizontal line instead of stacking vertically.

Issues identified:

  • Top and bottom spacing around the slide banner is too wide on mobile
  • Icon list elements are not displaying in one line as desired

Proposed solution:
A community member provided CSS code to address the spacing issues, with instructions to:

  • Navigate to Online Store → Themes → Three Dots → Edit Code
  • Locate the theme.liquid file
  • Insert the provided CSS before the closing </body> tag

Screenshots were shared showing both the problem areas and the expected results after applying the fix. The discussion appears to have a potential solution but awaits confirmation from the original poster on whether it resolves the issues.

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

Hi everyone

I need help regarding the banner ( Top spacing and Below spacing is to wide )

How can I make the spacing Tidy ??

My site : www.oscarliving.co.id

Theme : Empire 11.13

Screenshot 2025-04-29 at 2.58.19 PM.png
Screenshot 2025-04-29 at 2.58.19 PM.png342×1006 167 KB

and also How can I make the display on Icon list on this section become " 1 LINE "

Screenshot 2025-04-29 at 2.58.19 PM.png
Screenshot 2025-04-29 at 2.58.19 PM.png329×388 66 KB

Thank You very much

1 Like
2

Mustafa_Ali_0-1745917926202.png
Mustafa_Ali_0-1745917926202.png283×456 92.8 KB

Mustafa_Ali_1-1745917983978.png
Mustafa_Ali_1-1745917983978.png286×218 30.9 KB

Go to online store ----> themes ----> go to three Dots ----> edit code ---->find theme.liquid files ----> place the code ---->
before the body ----->
if this code work please do not forget to like and mark it solution