Webflow layout begins to destroy itself once it reaches 1920px up breakpoint?

I made an unwise decision to go beyond the default desktop breakpoint. For monitors with 1920px and up, the layout just gets so inconsistent and not aligned, no matter if I do a separate design of the same site in 1920px plus the view in Preview never gets to 100%, it’s defaulted to a lower view, making it harder to see how it will look like on a monitor of that size.

Has anyone solved this and made the 1920px layout look like the default view from the base breakpoint? (up to 1440px is still ok but 1920px makes your layout misaligned). Is the only option redoing the site and not going beyond the default desktop breakpoint view? The only hesitation to do redo the site is it’s already more than 100 pages.

Edit: I got a response from Webflow. There’s no turning back if you go beyond the breakpoint.

Mod Edit: I moved your post to optimum category.

Please include your site’s Read-Only Share Link with your question.
A read-only link allows the community to view your project without making any edits to it and help diagnose your issue or provide feedback.

If your project has custom code or layout issues on the published site, please share that URL/URI as well.

I got a response from Webflow. There’s no turning back once you go beyond the breakpoint. What’s a quick good strategy for redoing a 100-page site? Looking at client-first layout from Finsweet. Or create sections as symbols and copy paste to new site? How would you move assets (photos, icons) to the new site?

@premiumd - before you go there it may be possible to address layout issues with custom CSS.

If you duplicate a project, the breakpoints are copied as well. So that leaves you with only an option to rebuild, which is manual.

If you are going to copy and paste between projects (old to new), it is worth the effort to make sure all your page content is within a wrapper div as that can make things much faster.

This is a limitation that people need to be well aware of when choosing to add breakpoints.

Jeff, Appreciate the tips. I’ll look into CSS, has anyone used Tailwind for Webflow?
Yes, I saw how even a duplicated project has all the breakpoints as well.

Since you already mentioned Client-First you may already be familiar, but you can use the Finsweet Chrome Extension to remove unwanted breakpoints:

1 Like

@mikeyevin - Mike, that is a good find that I missed. Apparently support was not aware of it either.

Mike, You’re a big lifesaver. I was able to remove the unnecessary breakpoints. I’m back to the default breakpoint now. Finsweet, this is sweet. Thanks a bunch. I’m going to be rebuilding the site when I have time and I will definitely use Client First for sure next time. You do amazing work. :grinning:

However, I still have to figure out why Webflow Preview is still different from rendered page on a larger screen. I don’t know about everyone’s experience, but Webflow still need to make alignments better with a div block. It can stick to a size but only if you use Container, not Div Block.