I’m currently building a website for a client, and I was experimenting with a creative landing page. The results I have so far are actually pretty good I think, but I have one minor bug I can’t fix.
I’m working with a zoom effect. You see three pictures that become bigger when you hover over them with your mouse. Those images are in a div, and the overflow of the div is visible, because otherwise “rock that town” wouldn’t be visible when zoomed in on. The three div’s as a whole are also contained in one large div that simply has the size of your screen. The overflow of this div is set as “non-visible” to prevent the bug I still have:
In the Webflow preview everything looks fine, but when you go to “mindyourwords.webflow.io” instead (on a pc (!) haven’t got to the mobile part) and you hover over the most right image, you see that on the bottom of your screen a horizontal scroll bar appears, and if you scroll to the right, you can indeed see a part of the picture that I tought would not be visible due to the “non-visible” characteristic of the “main div” that has the size of your screen.
Somebody who knows the answer?
(A possible explanation is that this “main div” with the screen size also becomes bigger, but than the background of the excess part should be black, and it isn’t so …)
Thank you very much!
I know it’s just a minor bug but … (didn’t really know if it’s a bug or a design mistake)
Here is my public share link: https://preview.webflow.com/preview/mindyourwords?preview=d3e5c67be452f4da58370241b04484b6