Elements look fine in designer but design goes crazy on preview

Hi Webflow community - I am totally blown away by something.

How can I paste an entire section, complete with elements that all work perfectly fine on one page (Booth Prototype Page), onto another page (Expo Booths) and everything looks near-perfect until I hit Preview and then it all goes to pieces? Three buttons from the “booth” just go missing into thin air (only the buttons with interactions linked to popups, strange enough). I’m sure it’s just something silly I’m missing but I am completely baffled…

If anyone has any idea what’s going on, please enlighten me and I’ll greatly appreciate it!


Here is my site Read-Only: https://preview.webflow.com/preview/the-homeschool-hub?utm_medium=preview_link&utm_source=designer&utm_content=the-homeschool-hub&preview=ae8687f013281827225de25371e0ad7b&pageId=5f1c7682a807cda9a2c53c16&mode=preview

Hi @Calbie, it seems the interactions on the buttons are triggered by mouse click, so unless you click the style will be affected.

If you remove the mouse-click trigger and instead use page load it will work better. But if you are going to move the size/location of the elements inside a flex/grid you should be carefull because the movement of that element will affect all the elements inside as well. That’s also the reason why the video looks smaller.

You can see in my video what I mean:

Hi Carlos thanks very much for your help! I see what I need to do is, after I paste the section into the other page, I must re-map each mouse-click interaction to the correct popup again.

Really appreciate your input, you guided me in the right direction – I didn’t even think that the interactions could be affecting the whole thing.

You’re awesome!

image002.png

@Calbie you’re welcome! let me know if you see anything else.

Hi Carlos!

I’m just wondering if you perhaps have any idea what’s going on with this before I send it to the greater forum.

https://preview.webflow.com/preview/the-homeschool-hub?utm_medium=preview_link&utm_source=designer&utm_content=the-homeschool-hub&preview=ae8687f013281827225de25371e0ad7b&pageId=5f1c7682a807cda9a2c53c16&mode=preview

All of these little “booths” should be exactly the same, but the Educ8SA booth is totally messed up. Grid is a constant frustration for me as it never seems to behave predictably and caused me almost as many headaches as benefits.

If you can find out to make the Educ8SA booth the same as the others I would greatly appreciate it…

Thanks in advance,

Caleb K.

Nevermind! Figured it out! Logos at the top were affecting everything else. My sincere apologies for bothering.