Hi @JornK , thank you.
I do understand the way styles cascade over breakpoints. What I don’t quite understand is where exactly they do.
As I mentioned in my original post, the issue is captured in the screenshot from the Webflow University: I believe there should be the “≥” symbol, rather than “>”, to be truthful to the way the 1920px breakpoint currently works (as the description says correctly).
But it is not this petty formal detail that I am ‘complaining’ about It’s the effect it has.
The current generated style for the largest monitors looks like this:
@media screen and (min-width: 1920px)
This little detail means that on a 1920 x 1200 px monitor, the website may possibly look very different when viewed in a maximized window with no vertical scroll bar, compared to when the window is just one pixel narrower (typically, when it has a scroll bar, or is not maximized, but still close to the monitor’s size) - because it is exactly at this last pixel when the next style gets applied.
In my common sense, I guess I see our job to “style the website so that it looks good on a 1920px monitor” (which means the viewport will most likely be somewhere close to this width). This would work if the CSS looked like this:
@media screen and (min-width: 1921px)
While now, one device/monitor kind of requires thinking about two instances - which are triggered at an impractical point, in my humble opinion…
Does my reasoning make any more sense now?