Experiments with size units and Media Queries

Use Firefox's responsive view in devtools — or resize your browser window — to see Media Queries effect.
Change your root font size settings to see the impact of em/rem units.

Currently showing Media Queries in 40em on browser default font-size

Now, set a min-width Media Query at with

Current Media Query applied: smallerlarger than 40em

This reference box has a width of 40em
This box has a width of 20em30em
This box has a width of 20rem30rem
This box has a width of 320px480px