How do I actually set the quantity selector to width 100%?

Solved

How do I actually set the quantity selector to width 100%?

anapdeabreu
Excursionist
21 0 10

I've already made a change to base.css, but it seems like I can't fill it all in, there's a space missing. I use the dawn theme.
anapdeabreu_0-1719461268644.png

 

Accepted Solution (1)
Vinsinfo
Shopify Partner
427 143 143

This is an accepted solution.

@anapdeabreu Please follow below steps to set 100% width for quantity selector. Let me know whether it is helpful for you.

 

1. From admin, go to "Online Store" -> "Themes".
2. Click action button from the current theme and select "Edit code".
3. Go to "base.css" file and paste the below code at the bottom of the file and save changes.

 

.product .product-form__quantity {
    max-width: 100% !important;
}

 

Vinsinfo_0-1719556364332.png

 

Result will be like,
Vinsinfo_1-1719556371739.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.
Please reach out to [email protected] for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

View solution in original post

Replies 10 (10)

Raj-webdesigner
Shopify Partner
345 85 82

can you share perview link ?

Are you looking for Shopify Developer then your search is over I will help you


If you require further help to optimize your store, please don’t hesitate to reach out.


This contribution will always benefit you and you will get my full help easily and you can contact me easily.


Your Willpower Contribution Link

:-

❤️Tip❤️

Contect On My Mail :-[email protected]


Raj-webdesigner
Shopify Partner
345 85 82

Add This css in your edit code > base.css file

.product .product-form__input{
    max-width:100%;
}

Are you looking for Shopify Developer then your search is over I will help you


If you require further help to optimize your store, please don’t hesitate to reach out.


This contribution will always benefit you and you will get my full help easily and you can contact me easily.


Your Willpower Contribution Link

:-

❤️Tip❤️

Contect On My Mail :-[email protected]


JasmeetVT14313
Shopify Partner
273 59 72

Hi @anapdeabreu 
Please share the preview link so that I can guide you better

- VTN Customer Dashboard enhances your customer's dashboard with advanced features, profile management, and order tracking. Free trial available.
- Feel free to contact me at [email protected]

Vinsinfo
Shopify Partner
427 143 143

@anapdeabreu Please provide your store URL to help you on this.

Please reach out to [email protected] for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support
Vinsinfo
Shopify Partner
427 143 143

This is an accepted solution.

@anapdeabreu Please follow below steps to set 100% width for quantity selector. Let me know whether it is helpful for you.

 

1. From admin, go to "Online Store" -> "Themes".
2. Click action button from the current theme and select "Edit code".
3. Go to "base.css" file and paste the below code at the bottom of the file and save changes.

 

.product .product-form__quantity {
    max-width: 100% !important;
}

 

Vinsinfo_0-1719556364332.png

 

Result will be like,
Vinsinfo_1-1719556371739.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.
Please reach out to [email protected] for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

Dan-From-Ryviu
Shopify Partner
9619 1930 1964

Hi @anapdeabreu 

Please share your store URL so I can provide you with a solution. 

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

JasmeetVT14313
Shopify Partner
273 59 72

Hi @anapdeabreu 
Try adding below code to the end of section-main-product.css file

product-info .product-form__input {
    max-width: 100%;
}

 If this information was helpful to you, please give it a Like. If it resolved your issue, kindly hit Like and mark it as the Solution! Thank you!

- VTN Customer Dashboard enhances your customer's dashboard with advanced features, profile management, and order tracking. Free trial available.
- Feel free to contact me at [email protected]

EFOLI-Syn
Shopify Partner
85 1 0

Hello @anapdeabreu,

Please provide your store URL so that I can have a look into it.

Syn | eFoli
-Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Checkout our apps:Inkybay || MultiVariants