Open menu does not keep given width (50%)

For some reason, when my burger menu opens it does not display properly.

I created a left menu container for an image (at 50% width) and a right menu container for links (at 50% width) but when I view the site, it does not display this way.

Could someone please help?

https://preview.webflow.com/preview/park-website?utm_medium=preview_link&utm_source=designer&utm_content=park-website&preview=d0cd22814cc664b89b894f3f33d1598a&mode=preview

Thank you!

hi @Sophie_Jemtrud your problem is inside animation settings.

First you have set both containers to 50% but in animation you are setting them to 50% again. This mean that your left container will have now width 50% of 50% => 25% of 100% and your right container will get 75% because main container is set to flex.

All you have to do is to delete all left and right container settings inside of your animation and you should be fine. At least it wored for me in preview mode as I can’t store changes.

Create copy of your animation (to keep your original) and delete all settings I have mentioned and then apply this new animation to your element. See if this will work for you.

Thank you! Now it works as 50/50 but is not responsive. Any idea why?

Hi @Sophie_Jemtrud try to change nav menu width from 100% to 100vw to see if it helps

Thank you thank you thank you ! It works !

1 Like