buttons and tabs width extended all the way

elitaco
Explorer
81 1 17

Hi, why does the buttons and tabs width extended all the way after i've added the size chart(first pic)? It should have spacing like second pic.

url: elita.com.sg

elitaco_2-1631786409489.png

 

elitaco_1-1631786376035.png

 

 

Replies 6 (6)

oscprofessional
Shopify Partner
15905 2378 3087

Hello,
Welcome to the Shopify community!
Please Share your store live url with password (if it password protected) where you want to do modification, so that I will solve your issue here!

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free
elitaco
Explorer
81 1 17

hi, i would like to have some spacing between the tabs and product image (see second pic)

url: elita.com.sg

Zworthkey
Shopify Partner
5581 642 1574

hii, @elitaco 
Please add the size-chart so,
I can solve your issue perfectly.
Thank You.

oscprofessional
Shopify Partner
15905 2378 3087

@elitaco 

form#product_form_6882475507904 {
    width: 58%;
    margin: 0 auto;
}
.product__description.rte {
    margin: 0 auto;
}

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free
elitaco
Explorer
81 1 17

@oscprofessional hi, it works for desktop, but mobile version is off. It should be extended all the way

elitaco_0-1631844854529.png

 

Zworthkey
Shopify Partner
5581 642 1574

hii @elitaco 
paste this code on top of the theme.scss file.
For the mobile view.

@media only screen and (max-width: 768px) {
.shopify-payment-button {
    width: 40%;
    margin-left: 30%;
}
button.btn.btn--to-secondary.btn--full.product__add-to-cart-button.shopify-payment-btn.btn--secondary {
    width: 40%;
    margin-left: 30%;
}
}

Thank You.