How can I adjust the width of my product page buy button in code?

English Shopify Shopify Design
, ,
1

Hi, anyone here who knows coding and can help me real quick?

I’d like to change the width of my desktop version product page buy button and also a custom block (called “product details”). I don’t know how to find the proper setting for it on code and I don’t want to mess with it on my own. Basically I’d like both of them to be 350px wide (basically aligned with each other)
If you need, I can add you as a collaborator if you can manually change the code for me. I’m using Ella theme.

Here’s a screenshot:

Screenshot Example.png
Screenshot Example.png709×277 7.42 KB

2

Hi @Evyatar

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media (min-width: 1080px){

button{

width: 350px !important;

}}

In case the above code doesn’t work, can you send me the page URL so I can test it more carefully?

Hope that my solution works for you.

Best regards,

Henry | PageFly

3

First off, thank you for the quick reply!
I tried it but it messed up a lot of stuff so I had to delete that code and now it’s back to normal. I have access to the theme developers but it’s gonna take a couple days until they reply since it’s a weekend so I figured I’ll try to get it done beforehand.

Regardless here’s an example link: https://uniretro.com/products/1987-graphic-cropped-hoodie

4

You can try again with this code and add it to base.css like the above step:

button#product-add-to-cart {
width: 310px !important;
margin-left: 0 !important;
}