![]() ![]() I remember reading about it in gosh darn 2009, two jobs ago, thinking “this is going to make my visual/layout development so much easier, I can’t wait until browsers implement this”.ģ years later, 3 ungodly years later, I am still at the exact same state: “this is going to make my visual/layout development so much easier, I can’t wait until browsers implement this” This whole Flexible Box Layout Module has been the most frustrating thing in my career to date. I hadn’t even heard there was a new “version” of flexible box yet. They will make good references for testing browser support (and browser deprecation). Both syntaxes are capable of this easily (it’s otherwise fairly difficult). I recently helped someone with an issue of creating a Fluid-Fixed-Fluid column layout. The yet-to-be-released IE 10 looks like it will be shipping with the awkward tweener Flexbox (display: flexbox ). New syntax support is: Chrome 21+, Safari 6.1+, Firefox 22+, Opera (& Opera Mobile) 12.1+, IE 11+, and Blackberry 10+. Browsers that don’t yet support Flexbox will implement the new spec, which is in “CR” (Candidate Recommendation) status. At the least, it’s very likely the new syntax is easier to understand and will be implemented more deeply and more consistently. Browsers might drop support for the old syntax in the future. I say “support” because the actual implementations were partial and differed a bit (hence the re-write).ĭespite more support, it’s not smart to be using the older syntax. The old 2009 syntax has surprisingly good browser “support”: Chrome, Firefox 2+, Safari 3.1+… Pretty much everything except IE 9- and Opera anything. Things get a bit more complicated in terms of browser support. It features a warning at the top, but links to Stephen’s article using the 2011 syntax. ![]() I first got pumped about Flexbox from this Paul Irish article, which uses the 2009 syntax. His intro post uses the old 2009 syntax, then he did a follow up to the 2011 syntax unfortunately just one month before the current syntax was released. Stephen Hay has been writing about Flexbox for a good while. It passingly mentions the 2011 syntax but focuses more on the 2009 syntax. This article by Richard Shepard on Smashing Magazine during the awkward 2011 phase. Examples of Outdated StuffĪll this stuff was fantastic at the time it was created, but now is outdated:įlexie – a JavaScript polyfill for Flexbox, uses old 2009 syntax. If you are looking at a blog post (or whatever) about Flexbox and you see display: box or a property that is box- properties, you are looking at the current (as of this writing) specification. If you Google around about Flexbox, you will find lots of outdated information. Changes both to the spec and what browsers have implemented. Just so everyone is clear on this: “Flexbox” (more specifically: CSS Flexible Box Layout Module) has undergone a lot of changes in the last three years. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |