fotorama not working on single product page

[morgan_tartreau1]

Hi, my product image is not showing on its page (but on catalog it's working).

The image is indeed on the page (I can see it from the dev tools),but not on frontend directly.

the only I found to make this work is by adding a width 100% to all children

See in less :

.product{
  &.media{
    div{
      width:100%;
    }
  }
}

[Manthan Dave]

Hi @morgan_tartreau1

So after adding this css code in less file your issue is resolved or you still have any issue on this ?

[morgan_tartreau1 · Accepted solution]

I add my image, but it was very small.

Then I found the solution, if this could help somebody :

.gallery-placeholder{ width: 100%; }

Now the image has the good size and is at the good place

[Manthan Dave]

Hi @morgan_tartreau1

Yes , if you give 100% width on the gallery image then it looks perfect 

As images served from the gallery and .gallery-placeholder class covers whole section so if you have given 100% width on that then it works without any hassle

Anyways thanks for sharing your thoughts - if you think post is helpful mark accept as solution so other user gets helped !

Hope it helps !

[morgan_tartreau1]

I don't understand why we have to do this, is should be native in magento now...

[john_white2]

Took me DAYS to figure this out, and this small change ended up being the solution. Thank you!

[skin_wala]

Thanks!

[pasquale_cannavacciuolo]

I can't find a solution...i simply added a product to the store, in the homepage i added the block that show me the product in that  categori, but when i click on the product and i go to the single product page the image show up for 2 seconds and then i can't see anymore, by inspecting the element i can see that the image is loaded but not showed.

[debajyotin]

Any solution please post and I am facing the same issue too.

[BruceGemberling]

Did you add Bootstrap 4 to your theme or does your theme include Bootstrap 4? I found that if I comment out the CDN link to the Bootstrap 4 CSS the issue of your product main image disappearing after 2 seconds goes away.

I have not yet figured out what it is about Bootstrap 4 that causes this behavior.