Refresh theme - mobile version - reduce size between 2 sections

Store Design
, , ,

Topic summary

A user seeks to reduce spacing between two sections on mobile devices in their Shopify Refresh theme.

Proposed Solution:

  • Add custom CSS code to the base.css file
  • Use a media query targeting screens up to 767px width
  • Apply padding-top: 26px !important to specific slideshow/banner elements
  • Hide certain mobile text alignment classes with display: none

Implementation Steps:

  1. Navigate to Online Store → Theme → Edit code
  2. Locate the base.css file
  3. Paste the provided CSS at the bottom and save

Additional Recommendation:
Consider adding a title to the collection for better SEO and customer introduction.

Status: Solution provided but not yet confirmed as tested or resolved. One responder requested the website URL to offer further assistance.

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

Hi

I would like to know how to reduce the size (only on mobile version) between these 2 sections (I would like to reduce it by 70%)

41f4a73c-c879-4b1b-bab0-474011df7def.jpeg
41f4a73c-c879-4b1b-bab0-474011df7def.jpeg738Ă—1600 211 KB

Thanks a lot !

2

Hello @Edgard22 ,

Hope you are doing well,

can you please drop here your website link so I will be able to assist you.

1 Like
3

Hi @Edgard22

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media (max-width: 767px){

.slideshow__text.banner__box.content-container.content-container–full-width-mobile.color-scheme-3.gradient.slideshow__text–center.slideshow__text-mobile–left {

display: none !important;

}

.color-scheme-3.gradient {

padding-top: 26px !important;

}}

Additionally, I think you should add a title to the collection to introduce it to customers and optimize SEO

PageFlyHenry_0-1714123283303.png
PageFlyHenry_0-1714123283303.png720Ă—364 305 KB

Hope that my solution works for you.

Best regards,

Henry | PageFly

1 Like