Quantity button is to large on mobile devices - Dawn theme

[Dekanten]

Hi

The quantity button must be smaller to fit the thrashcan icon aligned beside it. I want the thrashcan icon on the right side of the button. Can that be fixed somehow? Thank you all again. 😎

www.dekanten.no

See attached image: 

[BSSCommerce-B2B · Accepted solution]

@Dekanten, Hi again 😀

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid

Step 3: Add this code before </body>

<style>
@media only screen and (max-width: 749px) {
    .quantity {
        width: 70% !important;
    }
}
</style>

Result: 

[sahilsharma9515 · Accepted solution]

Hi @Dekanten Please add the below code:

<style>
@media only screen and (max-width: 749px) { .quantity{
    width: 50% !important;
}
</style>

Please follow the steps:

1. Login in shopify admin.
2. Click on the Online Store.
3. Then click on the button next to Customize in live Theme.
4. Click Edit Code.
5. Search theme.liquid in the code in left hand side in your theme.
6. Add the following code in the bottom of the file above </body> tag

Result:

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil

[BSSCommerce-B2B · Accepted solution]

@Dekanten, Hi again 😀

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid

Step 3: Add this code before </body>

<style>
@media only screen and (max-width: 749px) {
    .quantity {
        width: 70% !important;
    }
}
</style>

Result: 

[Dekanten]

Hello my dear friend and glad to see this works like a charm again, many big huge thanks for the fix for me. Always a pleasure to get your help guys, really glad it worked well too. THANKS AGAIN 😀

[sahilsharma9515 · Accepted solution]

Hi @Dekanten Please add the below code:

<style>
@media only screen and (max-width: 749px) { .quantity{
    width: 50% !important;
}
</style>

Please follow the steps:

1. Login in shopify admin.
2. Click on the Online Store.
3. Then click on the button next to Customize in live Theme.
4. Click Edit Code.
5. Search theme.liquid in the code in left hand side in your theme.
6. Add the following code in the bottom of the file above </body> tag

Result:

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil

[Tech_Coding · Accepted solution]

Hello @Dekanten 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media only screen and (max-width: 749px) {
    .cart__items .quantity {
       width: 63% !important;
    }
}
</style>

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

[Dekanten]

Hi and thank you so much for your support and i got three solutions at once so i will for sure accept your solutions and give a like to all of them. Huge thanks gentlemen. 😀