The Media Queries Level 4 specification has introduced a new syntax for targeting a range of viewport widths using common mathematical comparison operators. New operators compare values rather than combining them, which make more sense syntactically while writing less code. As the screen gets narrower, we start to apply styles that are conditionally applied at smaller breakpoints that are ideally suited for tablets all the way down to mobile phones. As far as the layout goes.

7m read timeFrom css-tricks.com
Post cover image
Table of contents
New comparison operatorsTargeting a range of viewport widthsBrowser supportLet’s look at an exampleWhy the new syntax is easier to understandWrapping up

Sort: