Survey Project - Responsive Scaling Issue

Hello everyone, I hope you’re all ok.

I’m fairly new to coding but I’m really enjoying it so far. Usually when I encounter a problem I’ll spend a bit of time thinking about it, take a break and when I return, t-da! - I get a light-bulb moment.

Unfortunately the latest issue is really confusing me.

Working responsively (mobile-first) I’ve defined a root font-size of 10px in my body element which, when viewed in the Chrome Responsive Dev window, is behaving oddly. When I set the font-size for the first div (.container) the jump from 1.5rem to 1.6rem is massive.

Every 0.1rem before and after those breakpoints are fine.

Any help would be massively appreciated, thanks!


I might be wrong with this but, it can be the font type.
When you use a diffrent browser it somethimes can not recgonize the font/certain elements you are using thus getting back to the default. Which could explain the change in size

1 Like

Thanks for your response.

I’ve just taken my custom font out and tried Arial and I’m still having the same issue.

Update: I’ve just added to my and that’s fixed it.

(That’s my stupid act of the day done and dusted)