Reduce size of quantity box in mobile cart drawer

Hi, my website is doorstepdrip.com, I’m using studio theme. How can I reduce the size of the quantity box in the mobile cart drawer from this:

to this:

Try this. In your code files, go to component-cart-items.css and paste this in:

.quantity{
    transform: scale(0.75);
}

Let me know if that works. Thanks!

1 Like

Hi @doorstepdrip ,

I understand that you want to reduce the quantity box.

Try this one.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “theme.scss.liquid, styles.scss.liquid or base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
quantity-input.quantity {
    width: 11rem;
    min-height: 0px;
}
input#Drawer-quantity-1 {
    padding: 0px;
}

Result:

IDK if this size are enough.

I hope it help.

Thanks @Zqdo That worked! How can I align the quantity box and the rubbish bin to the left better please? It looks like this

Try this code right under the other code I gave you:

.cart-item__quantity-wrapper{
    position: relative;
    right: 20px;
}

Does that make it a little more aligned?