Why are my images loading in the wrong places on my online store?

[stanlegebeke]

Hello can anybody help me? My shopify store is loading my images at the wrong places sometimes and it is realy annoying. This problem occurs on mobile and on computer.

I want to solve the problem but when i make a new collection list the problem keeps occuring. I added images so you can see what the problem looks like.

I hope anybody can help me because i get way more bounces on my main page this way.

Kind regards, 
Stan Legebeke

[RomanG · Accepted solution]

Hey @stanlegebeke  This issue is related to vertical-middle class. I'm not sure why it needs. but it's the main cause. If you will remove this class or styles, this issue will be fixed. 

[made4Uo]

Hi @stanlegebeke,

Do you mind sharing your website? Your css file related to the images might be loading onload. This is usually done by developer to keep the website load faster

[stanlegebeke]

Hello,

My website is www.uwdiervoeding.nl.

Kind regards
Stan Legebeke

[RomanG · Accepted solution]

Hey @stanlegebeke  This issue is related to vertical-middle class. I'm not sure why it needs. but it's the main cause. If you will remove this class or styles, this issue will be fixed. 

[PageFly-Victor · Accepted solution]

Hi @stanlegebeke 

This is Victor from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
#shopify-section-b2f658dd-0072-4c8a-831e-c72bc1c4748f .vertical-middle {
position: unset !important;
    top: 50%  !important;
    transform: unset  !important;
}
</style>

Hope this can help you solve the issue 

Best regards,

Victor | PageFly