Return to previous page

Move the Buy Now button to the same row as the Add to Cart button

This topic has 4 replies, 2 voices, and was last updated 2 years, 5 months ago ago by Rose Tyler

Jason

Participant

June 2, 2022 at 01:52

Hi there, is that possible I move the Buy Now button to the same row as the Add to Cart button on the WooCommerce product page for saving more space?

Please, contact administrator
for this information.

#325009 Copied Theme version: 8.1.6 WooCommerce version: 6.0

3 Answers
Rose Tyler

Support staff

June 2, 2022 at 07:12
Hello,

Disable this option https://prnt.sc/FcLVNFvST1Ov and use the next custom CSS code:
```
.single-product-builder .single_add_to_cart_button ~ .et-or-wrapper {
    flex-basis: 10%;
    margin-left: 10px;
    margin-right: 10px;
}
.single-product-builder form.cart {
    display: flex;
}
.single-product-builder .et_product-block .et-single-buy-now.single_add_to_cart_button.button {
    width: 20%;
    flex-basis: 20%;
    min-width: 20%;
}
```
Regards
#325019 Copied
Jason

Participant

June 2, 2022 at 08:35

Hi there,

I used this custom CSS code and it shows that the Buy Now button is too narrow. Then I adjust the Min Width of Add to Cart button in Single Product Builder, it automatically adjusts the width of the two buttons to each other, looks normal.
But actually, the Buy Now button is never change, it’s still too narrow. How to fix this issue to adjust the width of both button?

Regards

Please contact administrator
for this information.

#325028 Copied
Rose Tyler

Support staff

June 2, 2022 at 14:56
Hello,

Please add this code also:
```
.single-product-builder form.cart .woocommerce-variation-add-to-cart {
    width: 100%;
}
```
Regards
#325059 Copied
Tagged: add to cart, button, buy now, move, themes, woocommerce, wordpress
Viewing 4 results - 1 through 4 (of 4 total)

The issue related to '‘Move the Buy Now button to the same row as the Add to Cart button’' has been successfully resolved, and the topic is now closed for further responses

Move the Buy Now button to the same row as the Add to Cart button

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection