Flexiejs.com has browser polyfill for CSS flex boxes, but it is based on an earlier draft on the topic, which is incompatible with the current W3C Candidate Recommendation CSS Flexible Box Layout Module. Is there any polyfill, at least partial, for flex boxes as defined in the CR?
There's currently no polyfill that implements the W3C Candidate Recommendation.
The author of flexie.js mentioned some time ago that he was working on updating flexie.js but there has not been anything published since then. So it's hard to say if or when it will actually materialize.
Flexie.js barely had any update since mid 2012 - see the contribution graph - and only support the 2009 Flexbox model, that means a limited set of property.
Reflexie.js is still untouched at the time of writing (2014 Oct), and as pointed out by
Ilya Streltsyn in another answer's comment, "it's still 'Sooooo not ready for prime-time'" as the author stated on the main page of the project. Latest commit was made on 1 Nov 2012...
There is a fantastic resource by Chris Coyier at:
The problem is there are three drafts in use for flexbox. Chris Coyier's article goes over all three versions and how to interleave them for cross-browser support. I have excerpted the relevant bits below.
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex;
-webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */ -moz-box-flex: 1; /* OLD - Firefox 19- */ width: 20%; /* For old syntax, otherwise collapses. */ -webkit-flex: 1; /* Chrome */ -ms-flex: 1; /* IE 10 */ flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */
-webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -ms-flex-order: 1; -webkit-order: 1; order: 1;
He claims support for:
I think the rest of the flexbox properties have not undergone revisions, so you can just use the "standard" set of prefixes (
©2020 All rights reserved.