Currently, the product information is not centered on the page. it is off to the left how do I make it center? other elements below the product information are perfect. Refer to screenshot for issue.
Hi i cannot share url currently. it should just be CSS change should it not be ?
Please share css change to center product information.
or liquid change thank you.
Hii, @jecbon
Paste this code on top of the section-main-product.css file.
@media screen and (min-width: 990px){
.product__info-wrapper.grid__item {
margin-left: 18% !important;
}
}
Thank You.
thank you sir, but can the product images move aswell ? there is now a gap between the product images and description.
@jecbon
Remove the code which I have given you.
@jecbon
Paste this code on top of the section-main-product.css file.
@media screen and (min-width: 990px){
.product.grid.grid--1-col.grid--2-col-tablet {
margin-left: 25% !important;
}
}
Thank You.
ok, do i add another piece of code ?
Remove the previous code and paste the new code.
Thank You.
Hii, @jecbon
Paste this code on top of the base.css file.
@media screen and (min-width: 990px){
section#shopify-section-template--15308353667327__main {
margin-top: 0px !important;
}
}
Thank You.
@media screen and (min-width: 990px){
.product.grid.grid--1-col.grid--2-col-tablet {
margin-left: 25% !important;
}
}
When implementing this code, it makes the image smaller… i want the image and the text to remain the exact same size but just shift the product information and images to the middle…
ok, remove the code.
I will give you a new code.
Thank You.
thank you.
Paste this code on top of the base.css file.
@media screen and (min-width: 990px){
.product__info-wrapper.grid__item {
position: relative !important;
left: 18% !important;
}
.grid__item.product__media-wrapper {
position: relative !important;
left: 19% !important;
}
}
Thank you Sir this is perfect
Most Welcome.
@Zworthkey the code works on desktop but not for mobile. I noticed the footer header before the links, called “quick links”, in mine, is not centered. How can I center this?