Hello, Im not a techy person and I need help. How will I align the buttons on Promotion Cards section? See attached screenshot
-
Check the settings of the Promotion Cards section: First, check if the theme you’re using has an option to align the buttons in the Promotion Cards section. If it does, it should be in the theme settings.
-
Use CSS to align the buttons: If there is no built-in option to align the buttons, you can try using CSS to align the buttons. CSS stands for Cascading Style Sheets and is a programming language used to style web pages. You can add custom CSS to your theme by going to Online Store > Themes > Customize > Additional CSS.
-
Use a page builder app: If you are still having trouble aligning the buttons, you can try using a page builder app like Shogun or PageFly. These apps allow you to create custom pages and adjust the layout of each section.
I hope these suggestions are helpful. If you have any more specific questions or need further assistance, please feel free to ask!
Hello @marketingapt1b
please share your store URL so i can provide you some solution for this.
Can you suggest additional CSS for this? Thank you!
Hello @marketingapt1b ,
It’s the GemPages Support Team and we are glad to assist you today!
Could you please share your store URL ( with the password if your store password is enabled ) then I can see and suggest something for you?
Best regards,
GemPages Support Team
Hello @marketingapt1b ,
We are AliReviews - All-in-one reviews solution for all businesses.
To align the buttons on the Promotion Cards section in the Shopify Debut theme, you can use CSS to adjust the layout. Here’s how:
- Go to Online Store → Themes → Actions → Edit Code
- Go to Assests folder → find “theme.scss.liquid” file.
- Add the following code at the bottom of the page:
.promotion-card__button {
display: flex;
justify-content: center;
margin-top: 20px;
}
This code sets the display property of the button element to “flex”, which allows you to use the justify-content property to center the buttons horizontally. The margin-top property adds some space between the buttons and the content above them.
- Save and test
Hope this can help, if so, please hit the Like Button or mark this as Accepted Solution to let us know, it means a lot to us.
Regards,
AliReviews team.
Please share your site URL,
I will check out the issue and provide you a solution here.
Here’s the URL: https://747273.myshopify.com/
on promotion Cards section
Sorry but this one doesnt work 
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file theme.css
Step 3: Paste the below code at bottom of the file → Save
.card__text.gutter--large.spacing--large.text-align--horizontal-left.remove-empty-space {
position: relative;
min-height: 300px;
}
.card__text .increased-spacing {
bottom: 10%;
position: absolute;
width: 100%;
left: 0;
padding: 0 40px;
}
Hello There,
Admin go to online store → themes → actions → edit code
Find Asset >theme.css and paste this at the bottom of the file:
#element-16540673826052f668-0 h3.h3 {
height: 89px;
}
div#element-16540673826052f668-1 h3.h3 {
height: 110px;
}
THanks it works!
1 Like
Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.
Paste bellow code
.increased-spacing {
bottom: 10%;
position: absolute;
width: 100%;
left: 0;
padding: 0 40px;
}
still cant be published
