Hey webflowers, While focusing on building more accessible websites, I started looking into using EMs for media queries/breakpoints. I am aware this is a controversial topic, and I am not here to discuss how viable it is to use EMs for media queries as I’d rather try it for myself and see how it goes. What I’d appreciate help with is how I can go about setting breakpoints in EMs in Webflow.
Since the current breakpoints are in pixels, zooming in does exactly what I want: the more you zoom in, the less window.width is which results in going from desktop → tablet → mobile the more you zoom in. However, I want to use EMs in breakpoints so that increasing the browser’s font size would result in the same behavior. Here is a demo built with Webflow where the background color changes based on the breakpoint. You will see that zooming in changes the background color, but changing the browser’s font size doesn’t.
Is there anyway (a js script for example) that allows me to use EMs for breakpoints?