Decrease hight of my banner

Topic summary

Main issue: Reduce the homepage slideshow/banner height in a Shopify store.

Initial approach: A CSS snippet was suggested for base.css using a media query (@media min-width: 990px) to set max-height: 400px on .slider-mobile-gutter .slideshow.banner.banner–adapt_image. This partially worked but introduced an unwanted scroll behavior in the banner.

Theme setting solution: Instead of custom CSS, the recommended fix was to use the slideshow section’s built-in “Slide height” setting in the Shopify theme (Refresh). Selecting a smaller slider size (e.g., small or medium) resolved the issue cleanly.

Clarifications:

  • base.css: the theme’s stylesheet where custom CSS can be added.
  • Media query: CSS rule that applies at specific screen widths (here, desktop ≥ 990px).
  • Slideshow/banner: the homepage hero section showing rotating images.

Attachments: Screenshots were provided to show where the “Slide height” option is located in the Refresh theme’s Customize panel.

Outcome: The user confirmed the theme setting worked. Status: Resolved. No further action items; optional support offered if needed.

Summarized with AI on December 31. AI used: gpt-5.

Hi @kazi_1 , thanks for the reply. But I don’t have that option in the settings of the slideshow