Skip to content

Instantly share code, notes, and snippets.

@carlos-sanchez
Last active January 12, 2017 10:01
Show Gist options
  • Save carlos-sanchez/7478234 to your computer and use it in GitHub Desktop.
Save carlos-sanchez/7478234 to your computer and use it in GitHub Desktop.
Feature Queries: @supports is now supported in every major browser
/*the following transition is applied to .box only if the browser supports CSS transitions.*/
@supports (transition: .5s) {
.box { transition: .5s; }
}
@supports not (display: flex) {
.box { display: inline-block; width: 25%; }
}
@supports (display: flex) and (transition: .5s) {
.box { display: flex; transition: .5s; }
}
@supports (-webkit-transform: rotate(-25deg)) or
( -moz-transform: rotate(-25deg)) or
( -ms-transform: rotate(-25deg)) or
( transform: rotate(-25deg)) {
.box {
-webkit-transform: rotate(-25deg)
-moz-transform: rotate(-25deg)
-ms-transform: rotate(-25deg)
transform: rotate(-25deg)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment