How to change the button width on this image banner?

[empiricalarby]

https://empiricalwater.com/

If you scroll down to the Rediscover your Tea image banner, how can the Buy Now and Learn Stuff button width be edited to be less wide?

Thanks

[fadi_yousif]

You can set a max-width by navigating to assets --> base.css and adding a CSS rule like this:

.banner__buttons .button {
  max-width: 150px;
}

Alternatively, you can add the code to the Custom CSS section inside the theme editor.

[ZenoPageBuilder · Accepted solution]

Hello @empiricalarby 👋

Inside Shopify Admin, you can go to Edit theme code, open file base.css and add this code at the bottom

.banner__buttons .button {
    width: 12rem !important;
    margin: auto !important;
    padding: 0 !important;
}

The result

Hope that helps!

[empiricalarby]

Awesome, thanks. How do I make these buttons sit one above the other instead of side by side? Thank you