Goal: place the “Buy Now” button next to the quantity selector and make them the same height to save space on the product page.
Proposed solution: add CSS in main.min.css to use Flexbox and adjust spacing:
Technical note: Flexbox (display:flex) lays elements side-by-side; align-items:center vertically centers them; removing the button’s top margin helps match heights.
Outcome: a screenshot shows the side-by-side layout, which is central to understanding the visual result.
Open question: a user on the Taste theme reports no main.min.css file and asks how to implement the same layout there; no alternative instructions or resolution yet, so the thread remains open.
On our product page https://satthwa.com/collections/popular-collection/products/hair-growth-serum
I would like to place the “Buy Now” button next to the quantity selector and preferably make them both the same height. This way the button is full width next to the quantity and saves space also.
@rocketdigital , go to main.min.css and add the following code :
.single-product-content .cart.nt_full {
display: flex !important;
align-items: center;
}
.add_to_cart_button {
margin-top:0 !important;
}
Result:
I can’t do this in Taste theme, because I don’t have that main.min.css file. How to do the same display in Taste theme?
Thanks, regards!
