weirdpattern/.2019.01.10.css-browser-support

## .2019.01.10.css-browser-support
2019.01.10.css-browser-support

## example.html
<html>
  <head>
    <style>
      .support-font-size-adjust {
        width: 22px;
        display:inline-block;
      }

      .support-font-size-adjust:after {
        content: '\274C';
        font-size: 12px;
      }

      .support-flexbox {
        width: 22px;
        display:inline-block;
        padding-left: 3px
      }

      .support-flexbox:after {
        content: '\274C';
      }

      @supports(font-size-adjust) {
        .support-font-size-adjust:after {
          content: '\2713';
        }
      }

      @supports(display:flex) {
        .support-flexbox:after {
          content: '\2713';
        }
      }
    </style>
  </head>
  <body>
    <span class="support-font-size-adjust"></span>Supports 'font-size-adjust'
    <span class="support-flexbox"></span>Supports 'flexbox'
  </body>
</html>

## syntax.text
@supports [not](<supports-condition>) {
  [styles]
}
	<html>
	<head>
	<style>
	.support-font-size-adjust {
	width: 22px;
	display:inline-block;
	}

	.support-font-size-adjust:after {
	content: '\274C';
	font-size: 12px;
	}

	.support-flexbox {
	width: 22px;
	display:inline-block;
	padding-left: 3px
	}

	.support-flexbox:after {
	content: '\274C';
	}

	@supports(font-size-adjust) {
	.support-font-size-adjust:after {
	content: '\2713';
	}
	}

	@supports(display:flex) {
	.support-flexbox:after {
	content: '\2713';
	}
	}
	</style>
	</head>
	<body>
	<span class="support-font-size-adjust"></span>Supports 'font-size-adjust'
	<span class="support-flexbox"></span>Supports 'flexbox'
	</body>
	</html>