Add to cart button, variants and share POSITIONING - How to center them (Narrative theme)

Solved
Highlighted
Shopify Partner
3 0 0

Hi,

 

I'm using the Narrative theme and I'm having a problem with this:

 

How do I center these buttons to be in the middle under the product? I tried few things in code but I can't find the right one. Can someone help? 

 

Thanks!

0 Likes
Highlighted
Pathfinder
98 12 41

This is an accepted solution.

They're in 2 seperate containers, the left side is product buttons and the right side is product info, so you can't center them unless you push the info below the buttons,

 

You can achieve what you want with the below code, paste it into theme.scss.liquid at the bottom of the page,

 

.product__content-main > div {
left: 0;
right: 0;
margin: auto;
}
.product__content-main {
    -webkit-flex-direction: column !important;
    -moz-flex-direction: column !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
}
@media only screen and (min-width: 750px) {
.product__description {
    width: calc(100% - 30px);
}
}

 

Highlighted
New Member
1 0 0

Hi, how do I add variants to the add to cart display on the home page with all the items. I added he code but it did not change

 

Site:swishbody.com

 

0 Likes