I love Modernizr to check if a browser support a certain CSS feature, but I found myself in the situation where I only had to check for flexbox support.
In this case, it seems a bit ridiculous to load Modernizr. You can use the following code instead:
var doc = document.body || document.documentElement;
var style = doc.style;
if ( style.webkitFlexWrap == '' ||
style.msFlexWrap == '' ||
style.flexWrap == '' ) {
doc.className += " supports-flex";
}Via Ethan Marcotte’s article “Putting My Patterns through Their Paces”.
3 Comments
Very cool, thanks for the tip. Need something similar for the small use cases of jQuery :)
Nice tip, would be trivial to use this to detect other features I’m sure.
I wonder how much longer we’ll have a need for detecting flexbox; especially with the recent news of Microsoft dropping support for Internet Explorer 8, 9 and 10. Browser support is already pretty high across the board http://caniuse.com/#feat=flexbox…
Microsoft isn’t dropping Internet Explorer 9—it’s the most current version of Internet Explorer in Windows Vista (which is still supported).