Join the Webstudio community

Updated 4 months ago

Copy & Paste from Webflow - Elements Became Oversized

At a glance

The community member is trying to switch some static sites to WebStudio and encountered an issue with oversized elements when using EM units. The comments suggest using REM units instead, as they are based on the root font size. The community member also had questions about changing the root font size, using components for a navbar, and transferring Webflow interactions to WebStudio. Other community members provided some guidance, suggesting to change the EM units on individual elements rather than the root, and to watch WebStudio's YouTube videos and search their Discord for more information. There is no explicitly marked answer in the comments.

Useful resources
I'm trying to switch a few static sites to WebStudio to test it out. I encountered an issue that elements were oversized. I'm using EM unit. I'd appreciate your help.

Read-only link in WebStudio: https://p-bcde0afc-90b8-4173-a09a-6f2d2fb79e01.apps.webstudio.is/?authToken=56d6bffc-7c42-41b3-9261-0186b029fba4&mode=preview
Read-only link in Webflow: https://preview.webflow.com/preview/evehemingway?utm_medium=preview_link&utm_source=designer&utm_content=evehemingway&preview=b4b2c3493cffab7b9041a75b208f55e5&workflow=preview

TIA
J
E
3 comments
Need more to go off. What issue are you talking about?

em units inherit based off their structure, if you want set unit size use rem, its based off the base unit (typically 16px - unless set differently)
The design I copy & paste seems to overflow. They get too big.

How do I change the root font size? Should I just change it in the root folder?

Is there component that I can change to use the navbar on multiple pages?

What about interactions? Some native Webflow interaction didn't get transferred over.

I know there are still some limitation and certain things I don't quite understand in WebStudio yet. Any help is appreciated.
  1. It's better to change the em units on your elements vs the root. I don't know what you mean about the root folder.
  2. Slots
  3. No interactions from webflow - Some items don't copy/paste. https://docs.webstudio.is/university/foundations/copy-paste/webflow
I'd suggest watching the Youtube videos by Webstudio, most of these answers could be found in there. Also searching in discord would give answers to the Webflow questions you had.
Add a reply
Sign up and join the conversation on Discord