DEV Community

Discussion on: How to use CSS Media Query Breakpoint in Styled-Components

Collapse
 
jordanfinners profile image
Jordan Finneran

You could also achieve this using CSS Variables which would mean you could ship less Javascript. 🎉
developer.mozilla.org/en-US/docs/W...

Collapse
 
cagatayunal profile image
Cagatay Unal

Yes, but some browsers do not support the css variable.
caniuse.com/css-variables

Collapse
 
jordanfinners profile image
Jordan Finneran

Only really IE11, which is a security risk for anyone using it. 🙈

Collapse
 
larsejaas profile image
Lars Ejaas

Nobe, unfortunately you cannot use CSS variables to set the breakpoint for the media query. env() variables will fix this, but they aren't ready yet - not sure when they will be? But yeah, you can of course use the css variables inside the styling all you want.