The preview doesn't match up with the live site


I am struggling with why my logo on the home page starts off horizontal on the live site, but shows correctly in an up-right position on preview. Once you start scrolling on the live site, the logo immediately goes to the correct positioning.

Is anyone able to help please?

Correct positioning…

Incorrect positioning…

Read only-link…

Live site…


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey @Sarah10

My guess would be that the animation you have added to the Body itself has parts which rotate the logo based on how far the page has been scrolled is interfering with the fact that almost none of your images have explicit height. When images don’t have height before they are loaded the page will shrink and grow so that might be what is happening there.

Try setting all your images to a certain height and see if the issue persists. If it does then try deleting the animation from the body called Paralax Scroll Effect and see if it’s still an issue. If it is then we’ll need to find which step is giving the issue at hand.

Let me know how it went, cheers!

Hi @marko-ninja

Thank you for the super quick reply. I have been playing around with it and the site works perfectly fine if I was to delete the Parallax Scroll effect. However, I really want to implement this animation.

I’ve now set minimum and maximum height on all images as well as the sections but now when you upload the Home and Projects pages on the live site, everything starts off in the positioned how it should look at the end of the scroll instead of the beginning, but once the scrolling takes action everything pops into the correct position. Would anyone know how to correct this?

Read only link…

Live site…

Thank you

Never mind, I just positioned all elements to its original position at the very end of the scroll. Which seems to have done the trick with a minor glitch.

Thank you for you help Marko