Published Website Looks Different on Computer vs. Monitor

Does anyone know why this is an issue?

When I look at the website on my laptop (2016 15 inch Macbook Pro), things look fine (Image 1). However, if I connect it to my monitor and view the website on my monitor screen, this look zoomed in.

Both my monitor and laptop are 4K, so breakpoint resolution issues are not the problem. I have also tried converting everything to REM (font, spacing, etc.) instead of pixels, but that also hasn’t worked.


In macOs you can set the “text size” in the display settings. By default it is not full resolution. Check your settings for that display.

Thank you for the response.

Is this what you’re referring to: Make it easier to see what’s on the screen of your Mac - Apple Support

I’m not sure if this is the issue. Image 2 refers to what I see on my monitor. Everything is scaled correctly on the monitor, except the website.

I am talking about display scaling →

I understand, but I don’t have that option on my computer. I’m running a 12.7 on a 2016 Macbook Pro.

You never shared a published link but I got it from your screenshot. Font sizes are pretty large from what I am seeing. Use your browser devtools and inspect your element at different breakpoints. That is an easy way to spot problems.

Apologies, here it is: Webflow - Ferveret