How do I reduce the top spacing or padding on a Buy Button?

Tim_T
Tourist
6 0 1

I have a shopify store but I'm also using the Shopify "Buy Buttons" on a pre-existing site. I'm trying to remove the spacing above the buy buttons. I seem to be able to reduce the spacing by default when I add a QTY value, but not when I use the regular button without the QTY value. Can't seem to edit the script on the button and can't seem to find any place in the CSS file to adjust it.

 

Here's how it looks:

button spacing.jpg

 

 

Looking through the code, 

 

Here's how it looks when I add the QTY option

QTY button.jpg

 

And this is how I WANT it to look.

QTY-button-no-spacing.jpg

 

When I inspect the code on the live website I see this:

 

.shopify-buy__btn-wrapper {
 margin-top: 20px;

 

dmwwebartisan
Shopify Partner
7292 1721 2292

@Tim_T 

 Find css/font.css and paste this at the bottom of the file: 

.shopify-buy__btn {
    width: 75% !important;
}

.shopify-buy__btn-wrapper {
    margin-top: 10px !important;
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
0 Likes
KetanKumar
Shopify Partner
20376 2110 7661

@Tim_T 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Tim_T
Tourist
6 0 1
Akibhusen
Excursionist
195 36 68

It's arrived in the iframe. So, might be custom CSS won't work.

Akibhusen Shekh | Shopify Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
0 Likes
KetanKumar
Shopify Partner
20376 2110 7661

@Tim_T 

You shall not pass!
atiracing.com is not a shopify shop
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Tim_T
Tourist
6 0 1

.shopify-buy__btn {
width: 75% !important;
}

.shopify-buy__btn-wrapper {
margin-top: 10px !important;
}

 

I tried adding that code to the site asset css, the font file css as well as the css style script on the page, and still no change.

0 Likes
Tim_T
Tourist
6 0 1

atiracing.com is not a shopify shop

 

Correct. We are using Shopify buttons on the site.

0 Likes