Solid button label shifted from solid button background issue

Store Design
, , ,
1

My shop runs on Dawn theme. The problem is that as you can see in screenshots 1, 2 and 3 is that the button label is shifted from its background.

button 1.PNG
button 1.PNG225×103 14.7 KB

button 2.PNG

button 3.PNG

I tried changing the button settings and the colors but it’s still there. While the white buttons are just fine as in screenshot 4

button 4.PNG

2

Hi
@itstaza1

Please share your store URL and password.

1 Like
3

Thank you for your reply.

Here is the url:

https://itstaza.com/

It’s published. No password needed

4

Paste this code in your base.css or the custom CSS of the section.

.button::after {
margin-top: 0px;
}

.button:not([disabled]):hover:after {
    margin-top: 0px;
}

I hope this will work.

Regards

Team_OSC

1 Like
5

Thank you so much. It worked for the homepage and the cart but not for the product page or customer sign in/register pages

6

For Product page:

.shopify-payment-button__button--unbranded:after {
    margin-top: 0px;
}

.shopify-payment-button__button--unbranded:hover:after {
    margin-top: 0px;
}

For Login:

.customer button:after {
    margin-top: 0px;
}

.customer button:hover:after {
    margin-top: 0px;
}

For Cart:

.button:after {
    margin-top: 0px;
}

.button:not([disabled]):hover:after {
    margin-top: 0px;
}

Let me know if it’s solved.

Regards

Team_OSC

1 Like
7

Thank you so much! It’s all working now except for the product page :broken_heart: