Product information is centered but the quantity selector is off-centered

Solved

Product information is centered but the quantity selector is off-centered

raresvlad
Tourist
8 0 2

Hi guys, recently I used the tips I found on shopify discussions to edit the code of my theme and center the product information. I managed to center it, but the quantity selector is more to the left than the others despite being kinda centered. 

 

Accepted Solutions (2)
Moeed
Shopify Partner
4400 1135 1393

This is an accepted solution.

Hey @raresvlad 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
div#Quantity-Form-template--20667834564898__main {
    max-width: 100% !important;
}
</style>

RESULT:

Moeed_0-1695124621959.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Moeed
Shopify Partner
4400 1135 1393

This is an accepted solution.

Hey @raresvlad 

 

Remove the previous code and add this new code as this code will work for all of your products.

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.product-form__input {
    max-width: 100% !important;
}
</style>

RESULT:

Moeed_0-1695125415951.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️

View solution in original post

Replies 13 (13)

webwondersco
Shopify Partner
1113 164 162

@raresvlad , Hope you are doing well.

 

Could you please share your store URL, so can check and guide your accordingly

Web Wonders | Shopify Partner | Connect here!
- Question answered? Mark as Accepted Solution, reply helpful? Click Like
- Hire me, if you want to design, re-design, develop a store, or make changes to the pre-built store.
- a small Coffee Tip would be greatly appreciated. :)..! Instagram

Moeed
Shopify Partner
4400 1135 1393

Hey @raresvlad 

 

Could you please provide your Store URL and, if applicable, the Password too? Your cooperation is greatly appreciated!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

Hi mate, I'm a bit of a newbie here. When you say sharing the URL which URL do you mean, just like the admin page one or do you want me to create a collaborator account?

Moeed
Shopify Partner
4400 1135 1393

You just have to share your website front end, which should be something like www.yourwebsite.com 

 

Best Regards,

Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

Oh, okay. 
www.keyutensil.com

Thanks a lot, sorry for being a bit clueless about it

Moeed
Shopify Partner
4400 1135 1393

Hey @raresvlad 

 

Your Store is password-protected, please share the password as well.

Moeed_0-1695124154875.png

 

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

I sent it in a private message, hope you received it. Thank you

 

Moeed
Shopify Partner
4400 1135 1393

This is an accepted solution.

Hey @raresvlad 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
div#Quantity-Form-template--20667834564898__main {
    max-width: 100% !important;
}
</style>

RESULT:

Moeed_0-1695124621959.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

Thank you so much, mate. Relieved me from a lot of stress 

Moeed
Shopify Partner
4400 1135 1393

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

One question, how can I do that for all the other products?

Moeed
Shopify Partner
4400 1135 1393

This is an accepted solution.

Hey @raresvlad 

 

Remove the previous code and add this new code as this code will work for all of your products.

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.product-form__input {
    max-width: 100% !important;
}
</style>

RESULT:

Moeed_0-1695125415951.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
raresvlad
Tourist
8 0 2

Yes, that did it. Thank you lots 😁