Skip to content

Instantly share code, notes, and snippets.

View carlos-sanchez's full-sized avatar

Carlos Sánchez carlos-sanchez

View GitHub Profile
@carlos-sanchez
carlos-sanchez / support.css
Last active January 12, 2017 10:01
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%; }
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1"> <!-- allows zoom -->
<!-- or -->
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> <!-- blocks zoom -->
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title></title>