Need help with responsive design

Design help General
1

Hello community. I have been working on my portfolio website, for some time and I got stuck with a problem.

I did the entire project on a 13’’ Macbook. I did add 2 breakpoints (1440 and 1920). Everything looks fine when I preview from the 13’’ Macbook but if I open my website on a 16’‘, it looks a bit weird and any edit I do in the 1920 breakpoint doesn’t change how it looks on the 16’’ Macbook.

Plus that on mobile or tablet on Webflow preview looks a bit off but when I open the website on a device, looks fine

Here is my website - I should mention that this is my second time when I use webflow so I am quite new with this.
https://123-68e9b8.webflow.io/

Here is my site Read-Only: https://preview.webflow.com/preview/123-68e9b8?utm_medium=preview_link&utm_source=designer&utm_content=123-68e9b8&preview=5a2208c2980d3a862f912d216ad955c9&mode=preview

2

Yes, sometimes it is difficult to accommodate unlimited width.

You can set an additional one or two breakpoints, and set up a container of max 2600px width for example.

You may find vw and vh work better sometimes.

1 Like
3

The weird thing is that when I am editing in the 1920px breakpoint, when I check the website from a 16’’ macbook, I see no change, not even the colour of the text.

4

@radugeorgee I’m guessing this could be caused by the default system scaling. If you’ve never changed this setting, the 16" macbook is scaled to < 1920px by default. So changing on the 1920px breakpoint will not do anything.

1 Like
5

I figured out that editing in 1440 breakpoint, does change the view on the 16” MacBook… wired but I am now working only with VW for text and divs so it will looks how I wanted on both screens.