Focal Theme | Want to Remove Wanted Spaces and Padding in the Product Pages

[shivamnew]

Hi,

Please help to remove unwanted padding and spaces arround product page pictures.

also please help to increase the image sizes of the products in products in the collection pages.

[Hardik29418]

Please go to
1) Online store
2) Themes -> Edit theme
3) Layout
4) theme.liquid and paste this code before </head>

<style>
@media screen and (max-width: 740px) {
.product:not(.product--featured) {
  margin-top: 0px !important;
}
}
@media screen and (max-width: 999px) {
.product__media-item {
    padding-left: 0px !important;
    padding-right: 0px !important;
}
}
</style>

[PageFly-Henry]

Hi @shivamnew 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.css

Step 3: Paste the below code at bottom of the file -> Save

@media screen and (max-width: 767px){

.product.product--thumbnails-bottom {
margin-top: 0 !important;

}

 .product__media-item {

    padding-left: 0 !important;

    padding-right: 0 !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[shivamnew]

i implemented the code but it taking time to load

mean after multiple refreshes it in full 

[oscprofessional]

Hello @shivamnew 

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->theme.css>Add this code at the bottom.

.product__media-item {
    padding: 0 !important;
}