Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Cornerstone - button outline

Cornerstone - button outline

meld78
Shopify Partner
70 1 14

Hi there,

I'm using the theme cornerstone and on the homepage, there is a promotional grid. No matter what I do, the buttons won't get an outline.

 

I have tried this code which is half-way working but the button is too big (height) and I would prefer the wording "shop bestseller" in one line.

 

Is someone able to assist?

Store URL www.31031b-75.myshopify.com

PW: aubiep

 

Thank you.

 

.promotion-grid-item__promotion-text {
display: inline-block; /* Makes the link behave like a button */
background-color: #CEB5D6 !important; /* Button background color */
color: #ffffff !important; /* Text color */
padding: 10px 20px !important; /* Padding to create a button effect */

outline: 1px solid #ffffff !important; /* Thinner white outline */
border-radius: 20px !important; /* Rounded corners */
text-align: center; /* Centers the text */
text-decoration: none !important; /* Removes underline */
box-shadow: none !important; /* Removes any shadow */
}

 

meld78_0-1728250223716.pngmeld78_1-1728250246215.png

 

Reply 1 (1)

Made4uo-Ribe
Shopify Partner
9063 2165 2672

Hi @meld78 

Reduce the padding left n right and add this code.

 

p.promotion-grid-item__promotion-text.ff-body {
    white-space: nowrap;
    padding: 10px 5px;
}

 

And save. 

Result:

Made4uoRibe_0-1728252035558.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.