Increase height of a column in Prestige theme

Store Design
,

Topic summary

A Shopify store owner using the Prestige theme encountered a display issue where “Add to Cart” (ATC) buttons added via an app were being cut off on the homepage due to insufficient column height.

Solutions Attempted:

  • Initial CSS suggestion to modify .flickity-viewport height caused the homepage banner to shrink
  • Alternative code targeting .sw_quick_buy min-height was proposed
  • GemPages support team provided CSS to be added in the theme.liquid file before the </body> tag

Current Status:

  • The GemPages solution initially appeared to work
  • However, the issue persists in Safari browser where the ATC button still gets cut off at the bottom
  • The store owner is seeking additional guidance to resolve the Safari-specific display problem

Screenshots were shared throughout to illustrate the problem and testing results across different browsers.

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

Hi All,

I need a small help related to my website design. I had recently added an app to display “Add to Cart” button on my products and it’s working fine. However on the home page, the ATC button is not displaying properly because height of that particular section is less. I need to increase the bottom height a bit so that ATC button is visible.

kavipoetryart_0-1669789862601.png
kavipoetryart_0-1669789862601.png1920×1080 316 KB

Please check the image reference. The yellow color in the second and third product is actually the ATC button which is not being displayed properly. If we slightly increase the size, that will be visible.

Please check and help. Thank you in advance.

Website link: www.kavipoetryart.in

Theme: Prestige

2

@kavipoetryart ,

.flickity-viewport {
    height: 454px !important;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

3

Try adding the code. But after adding this, Homepage banner page has shrunken. Please check attached image.

kavipoetryart_0-1669792555670.png
kavipoetryart_0-1669792555670.png1920×1080 313 KB

4

You can try to add this code

.ProductItem .ws_quick_buy { min-height: 60px; }
5

Hello @kavipoetryart

It’s GemPages support team and glad to support you today.

You can follow these steps:

  1. Go to Online Store → Theme → Edit code
  2. Open your theme.liquid theme file
  3. Paste below code before :

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

6

Sorry, not working.

7

Hey,

Thanks. Finally working.

8

I am glad that my suggestion is helpful to you.

Best regards,
GemPages Support Team

9

I just checked in safari browser. The ATC is getting slightly getting cut from the bottom. What should I do for that? Attaching screenshot for the same.