Cart – Quantity

This topic has 16 replies, 2 voices, and was last updated 2 months ago by Aizaz Imtiaz Awan.

Viewing 17 posts - 1 through 17 (of 17 total)

Author

Posts
June 5, 2025 at 3:49 am #665428

amasterytchan
Participant

Hello Support,

After updating to 8.2.0, I have a minor issue I can’t resolve.
The quantity count on the cart page is out of alignment and, of course, it messes up the mobile view as well. The checkout page is fine.
See screenshot.
I hope you can point me in the right direction to correct this.
Thanks,
AM

Attachments:
You must be logged in to view attached files.

June 5, 2025 at 11:33 am #665498

Aizaz Imtiaz Awan
Keymaster

Hello,

I am unable to visit or log in to your site. Please remove the IP restrictions. I am accessing the site from Pakistan.

Best Regards,

June 5, 2025 at 12:31 pm #665522
Aizaz Imtiaz Awan
Keymaster
Hello,

Try to add the following custom css code in Theme Settings > Custom CSS > Global Custom CSS area:
```
.woocommerce-cart-form .quantity {
    display: inline-flex !important;
    align-items: center !important;
    height: 42px !important;
}

.woocommerce-cart-form .quantity .qty {
    height: 42px !important;
    line-height: 42px !important;
    padding-bottom: 0 !important;
    margin-top: -20px !important;
    vertical-align: middle !important;
}
```
Best Regards,
June 5, 2025 at 2:24 pm #665561

amasterytchan
Participant

Hello Aizaz,

The IP restrictions should now be removed. Thank you for the CSS. It looks fine on the Desktop but is still slightly off in mobile view. See screenshot. Which value controls that?

Thanks.
AM

Attachments:
You must be logged in to view attached files.

June 5, 2025 at 3:52 pm #665604
Aizaz Imtiaz Awan
Keymaster
Hello,

Please use the previous code in the desktop CSS area and add the following code in the Mobile CSS area in Theme Settings > Custom CSS:
```
.woocommerce-cart-form .quantity {
    display: inline-flex !important;
    align-items: center !important;
    height: 42px !important;
}

.woocommerce-cart-form .quantity .qty {
   height: 31px !important;
   line-height: 42px !important;
   padding-bottom: 0 !important;
   margin-top: -26px !important;
   vertical-align: middle !important;
}
```
Best Regards,
June 5, 2025 at 7:13 pm #665641

amasterytchan
Participant

Hi Aizaz,

I’ve done as you instructed. The first block of code is in the Desktop CSS and the second block is in the Mobile CSS, however, I don’t see any change on mobile.

Thanks for your time.
AM

June 6, 2025 at 10:30 am #665721

Aizaz Imtiaz Awan
Keymaster

Hello,

Your issue has been resolved. Check back your site and check the issue.

Best Regards,

June 6, 2025 at 2:25 pm #665808

amasterytchan
Participant

Hello Aizaz,

I copied the mobile CSS, which appears to fix the portrait view, but the cart is still not displaying correctly on a Tablet in landscape.

Thanks,
AM

June 6, 2025 at 3:13 pm #665840

Aizaz Imtiaz Awan
Keymaster

Hello,

Try to add the previous code in the tablet css area and change the height value in the code to adjust it.
https://ibb.co/B2gP40dr

Best Regards,

June 6, 2025 at 4:38 pm #665858

amasterytchan
Participant

Hello,

.woocommerce-cart-form .quantity {
align-items: center !important;
margin-top: 10px;
}

.woocommerce-cart-form .quantity .qty {
height: 30px !important;
margin-top: -20px !important;
}

This CSS corrects the view in Tablet portrait, but in landscape it’s still broken.
Thanks,
AM

June 6, 2025 at 5:10 pm #665875

amasterytchan
Participant

I just noticed that Mobile landscape is also broken.

June 9, 2025 at 7:26 pm #666267

amasterytchan
Participant

Updating to 8.2.2 has made no difference. The problem is not just the cart quantity but also the cart page itself. The responsiveness also seems to be broken.

Is it still possible to get 8.1.2?

Thanks,
AM

June 10, 2025 at 9:33 am #666426

Aizaz Imtiaz Awan
Keymaster

Hello,

Your issue has been resolved. Check back your site and check the issue.

Best Regards,

June 10, 2025 at 8:09 pm #666589

amasterytchan
Participant

Thank you Aizaz!
May I ask what the issue was to avoid it happening again?

AM

June 11, 2025 at 9:27 am #666642

Aizaz Imtiaz Awan
Keymaster

Hello,

The issue was caused by the Cart version that was edited using Elementor. I have removed all the custom css code and switched the cart page to native WooCommerce shortcode, and the page is working correctly.

Best Regards,

June 11, 2025 at 11:21 pm #666857

amasterytchan
Participant

Thank you for sorting that out for me, though I’m unsure how that would happen. I’ve never edited the cart, not intentionally anyway.

Thanks again. Very much appreciate your time.
AM

June 12, 2025 at 10:10 am #666930

Aizaz Imtiaz Awan
Keymaster

Hello,

You’re very welcome! If you need anything else, feel free to reach out!

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards,
Author

Posts

Viewing 17 posts - 1 through 17 (of 17 total)

The topic ‘Cart – Quantity’ is closed to new replies.

Cart – Quantity

Attachments:

Attachments: