[Resolved] woocommerce quantity button.

[Jusung]

Hello!

When you try to add the product on link to cart,
you can see the plus and minus button to adjust the quanity.

I want to put it horizontally, not vertically.
Can I make it by CSS.>??

[David]

Hi there,

do you mean like this?

[Jusung]

Yes exactly. I want to put it horizontally.

[Fernando]

Hi Jusung,

Try adding this through Appearance > Customize > Additional CSS:

.single-product.woocommerce div.product form.cart {
    flex-wrap: nowrap;
}
.single-product.woocommerce div.product form.cart .quantity {
    padding-right: 5px;
}

[Jusung]

I added the code, but it doens’t change anything..

[Fernando]

This is what I’m seeing on your site now: https://share.getcloudapp.com/DOulXBR2

It seems to be working.

[Jusung]

Yeah. there it is what I want.

But when you click, add cart and view cart, on the cart page, it doesn’t look like that.
It is aligned vertically on cart page.. I want to put it horizontally.

[David]

In your CSS you have this:

.quantity {
    padding-right: 100%;
}

That is causing an issue with quantity buttons aligning on the product and cart page.

Can you remove that.

Then add this CSS to ensure its a flexbox:

.quantity.buttons-added {
    display: flex;
}

[Jusung]

thank you! It works!

[Author]

Posts