@custom-media
An experimental at-rule that lets you define reusable media queries (like '@custom-media --tablet (max-width: 768px)') for cleaner, more maintainable code.
This is an experimental technology. The syntax and behavior are still subject to change.
Syntax
/* Usage Example */
/* Experimental: Define a reusable media query */
@custom-media --small-viewport (max-width: 480px);
@media (--small-viewport){
.container{ padding: 10px; }
}@custom-media Browser support
Limited availability
Since
2020 Unknown global usage
This feature is not Baseline because it does not work in some of the most widely-used browsers.
148+
Your first month is free
Managed WordPress hosting for faster sites.
Learn more