Shopify themes, liquid, logos, and UX
On desktop, I am trying to align my add to cart button with my customization fields on the product page in the debut theme. I have tried changing the size of the button but when I go on to mobile, it extends past the page and looks sloppy.
my website is: myjerseyposter.com
here are screenshots of the issue:
before (desktop):
after (desktop):
- after (mobile):
thank you, i appreciate any help!
Solved! Go to the solution
This is an accepted solution.
Thanks for post
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.product-form__item--no-variants { max-width: 100%; }
Hey,
Can you share the code you've changed here?
Hi,
within the theme.scss.liquid this is the code i have changed. all i have done was change the width.
before:
.product-form__cart-submit { display: block; width: 100%; line-height: 1.4; padding-left: 5px; padding-right: 5px; white-space: normal; margin-top: 0; margin-bottom: 10px; min-height: 44px;
after:
.product-form__cart-submit { display: block; width: 133%; line-height: 1.4; padding-left: 5px; padding-right: 5px; white-space: normal; margin-top: 0; margin-bottom: 10px; min-height: 44px;
thanks again!
This is an accepted solution.
Thanks for post
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.product-form__item--no-variants { max-width: 100%; }
Hello guys,
that alone did not work for me, I also had to do the following and finally everything is working fine, after spenging a lot of time on this issue:
theme.css:
.product-form--payment-button-no-variants {
max-width: 100%;
}
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
User | RANK |
---|---|
140 | |
101 | |
88 | |
57 | |
47 |
Connect your PayPal account to allow your customers to checkout using the PayPal gateway a...
ByYour online store speed can enhance your store’s discoverability, boost conversion rates a...
ByShopping is at our fingertips with mobile devices. Is your theme optimized to be user-frie...
By