Problems with displaying responsive design in the WebFlow editor

Design help Layout & Design
1

Hi. I’ve noticed a strange issue: the Web Flow Editor doesn’t display the responsive design result correctly. On the right is what I see in the editor. On the left is what the screen actually looks like, checked manually from devices and using developer tools in the Google Chrome browser.

qa
qa932×626 114 KB

Who knows what could be the reason?

And the second question, for the future, I see that many developers use solutions with limited screen width. For example, they set the maximum width to 1333 pixels. This way, they manage to achieve fairly stable results in displaying the design. Could you please tell me what I need to know about this and how much such solutions can make it easier for me to develop websites in the future?

Because now for me create the first screen as in the example with the photo it’s absolutely hard work :frowning_face:

Here is my site Read-Only: Webflow - grishamisilyuk

2

Hi

Your section wrappers are set to 63VH, so in the editor, you’re probably looking at a very long window which is changing the dimensions of your pic.

Make your editor window match the approximate view of a mobile device and it should display correctly.

3

Thank you, man! I left the height of the first screen 100VH only for desktop, in all other sizes (tablet, mobile, mobile horizontal) I set the size of the first screen in VW according to the size of the elements: top padding + height of the field with text and contacts + height of the vertical gap to the button + button height + another padding as at the top. And now it was perfectly responsive. Thank you very much.