We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

BUTTON ALLIGNMENT

Solved

BUTTON ALLIGNMENT

nothingchanges
Explorer
69 0 18

Hi!

 

I need help aligning the buttons based on my picture. 

 

https://nothingchanges.com.my/

 

Thanks in advance!

 

Screenshot 2025-06-22 at 2.55.30 AM.png

Accepted Solution (1)

devcoders
Shopify Partner
1654 190 545

This is an accepted solution.

Hello @nothingchanges 

1. From your Shopify Admin, navigate to Online Store > Themes > Edit Code
2. In the Assets folder, open base.css and add your CSS code at the end

div#Banner-template--24573836820843__image_banner_nWqxB7 .banner__buttons {
gap: 72rem !important;
justify-content: center;
}

 

devcoders_0-1750570181817.png

 





Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!

View solution in original post

Replies 6 (6)

horlaincome
New Member
4 0 0

Hello! I see what you're aiming for with the button alignment totally doable. I can get that cleaned up and aligned just like in your screenshot. Let me know if you'd like me to jump in. I can take care of it for you as a quick commission.

The_ScriptFlow
Trailblazer
201 17 26

Hey @nothingchanges,

In order to change the position of the first button to the left side then you need to ensure that the max-width of the buttons increase. Currently it's 95rem but if you could make it sometime 97rem then your requirements sure fulfill.

Paste the following code in the end of base.css file.

@media screen and (min-width: 1400px) {
  .banner__box {
    max-width: 97rem !important;
  }
}

Results:

results.png

- Need a Shopify Specialist? Chat on WhatsApp Or Email at info@thescriptflow.com
- For any custom section queries, bug fixing please visit: Level 2 Fiverr Profile
- Buy Me a Coffee? Nah… Let’s Upgrade to a Car
- If my solution was helpful, mark it as a solution and hit the like button!
nothingchanges
Explorer
69 0 18

Thank you for the reply.

 

Unfortunately, it is still the same after i paste the code. Is there any other possible solution?

horlaincome
New Member
4 0 0
Hello
I attached a file with the response you can check it and take action in

devcoders
Shopify Partner
1654 190 545

This is an accepted solution.

Hello @nothingchanges 

1. From your Shopify Admin, navigate to Online Store > Themes > Edit Code
2. In the Assets folder, open base.css and add your CSS code at the end

div#Banner-template--24573836820843__image_banner_nWqxB7 .banner__buttons {
gap: 72rem !important;
justify-content: center;
}

 

devcoders_0-1750570181817.png

 





Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!
nothingchanges
Explorer
69 0 18

YOU ARE AWESOME! THANK YOU SO MUCH!