Shopify themes, liquid, logos, and UX
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
Hello, do you know how to align these two buttons horizontally please?
Website : https://coconbypharell.com/products/cloche-de-lit-1
Thank you !
Hey! The easiest way is to check your theme settings under Online Store > Themes > Customize. Look for layout options in the product page section.
If this doesn't work, let me know and I'll help from there.
Hi @hervé_stg
You can follow this instruction:
1. Go to Shopify > Theme > Customize
2. Copy and paste this code on Theme settings > Custom CSS section
div:has(product-form) {
position: relative;
}
product-form {
position: absolute;
top: -87px;
left: 160px;
}
Result:
Hi @hervé_stg, thanks for reaching out.
I checked your request and would like to inform you that you’ll need to adjust the class structure in your theme’s Liquid file and update the CSS accordingly. If you're using a custom theme, I recommend you reach out to your theme developer for assistance because they can adjust the layout directly in the code.
I hope my information is helpful to you.
Liz
Hi @hervé_stg
Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings.
.product__info-wrapper div:has(.product-form) {
max-width: calc(100% - 160px);
float: right;
width: 100%;
}
.product__info-container .icon-with-text {
width: 100%;
}
.product__info-container .product-form__quantity {
float: left;
}
- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.