What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: move size drop down next to color drop down

Solved

move size drop down next to color drop down

v6
Tourist
17 0 2

I was wondering how I could move the size drop down next to the color, preferably with about an inch space in-between and also bring both buttons below it further up to be below the drop downs
v6_0-1708517904248.png

 

Accepted Solution (1)
ThePrimeWeb
Shopify Partner
2139 616 515

This is an accepted solution.

Hey @v6,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product-form__input.product-form__input--dropdown {
    display: inline-block !important;
}

body .product-form__input, body .product-form__input .select {
    max-width: 100% !important;
    margin-right: 20px !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708525161376.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 6 (6)

ThePrimeWeb
Shopify Partner
2139 616 515

Hey @v6,

 

Can you share the link to your store?

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
v6
Tourist
17 0 2

https://dressedmen.com/ 

password: nohwha

v6
Tourist
17 0 2
ThePrimeWeb
Shopify Partner
2139 616 515

This is an accepted solution.

Hey @v6,

 

Go to your theme's "Edit Code" Option, then in the search bar type "theme.liquid"
Below the tag "<head>" tag paste the following. Screenshot attached for reference.

<style>
.product-form__input.product-form__input--dropdown {
    display: inline-block !important;
}

body .product-form__input, body .product-form__input .select {
    max-width: 100% !important;
    margin-right: 20px !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1708525161376.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

Vinsinfo
Shopify Partner
460 158 157

@v6 Please share store URL to help you on this.

Please reach out to bizdev@vinsinfo.com 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
v6
Tourist
17 0 2

https://dressedmen.com/

password: nohwha