fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Layout Shifts left and then right during product page load

Gursheen Wadhwa Mahipal

My webpage is https://whitedomus.in/shop/wall-art/tree-of-life/

I have adjusted some sizes for the image and the gallery. When the page opens it first shifts to the left and the right. How can i adjust this so that it doesnt shift like this. Please advice.

Also please give css for mobile view and tablet view, my images donot appear well on these device.

Hakik Zaman

Hi Gursheen,

Thanks for reaching out to us. The issue is coming from your custom CSS at Appearance > Customize > Additional CSS

@media only screen and (min-width:768px){#qodef-woo-page.qodef--single .qodef-woo-single-image{width:50%}}

You have applied 50% for the first markup but not for the second. I have added the below CSS to resolve this-

#qodef-woo-page.qodef--single .qodef-woo-single-inner {
   flex: 1 1 50%;
}

@media only screen and (min-width:768px){
   #qodef-woo-page.qodef--single .entry-summary {
      width: 50%;
   }
}

Please check now and don’t forget to clear your cache like- Browser Cache, Caching Plugin Cache, and Server-Side Cache.

Thank You