CSS hack: Difference between revisions

Revision as of 06:47, 14 October 2017

Revision as of 06:53, 14 October 2017

Line 103:

==== JavaScript feature detection ====

Multiple JavaScript libraries exist to detect what features are available in a particular browser so that CSS rules can be written to target them. Libraries such as ModerModernizr add classes to the <code>html</code> element, allowing for CSS rules such as <code>.cssgradients .header</code>.

==== <code>@supports</code> ====

A new feature known as feature queries was introduced in CSS3, allowing the detection of specific functionality within the CSS (without requiring the use of a JavaScript library for feature detection). This new directive can be used to check for the support or lack of support for a specific feature, and checks can be combined with <code>and</code>, <code>or</code>, and <code>not</code>. Obviously, <code>@supports</code> rules will only work on browsers that support <code>@supports</code>. <syntaxhighlight lang="css">

header {

display: block;

}

@supports (display:flexbox) {

header {

display: flexbox;

}

}