Another good explanation on CSS-Tricks: http://css-tricks.com/snippets/css/a-guide-to-flexbox/ Browser support: http://caniuse.com/#search=flexbox
Except on my phone I was seeing the left and middle taking up 50% and the right one being pushed down and taking up 100%.
In addition to that, below a certain width, the CSS on the parent UL is being changed from flex-wrap: nowrap; to flex-wrap: wrap;, so when the container shrinks to a width smaller than the sum of the flex-basis of all elements, it will wrap.
Keep in mind I haven't read the flex spec yet, though, so that's based on observation not spec.
A grid representation of a list, let's say a list of image thumbnails along with small amount of other data. Something like the image grid in iPhoto.
What's so hard? Let me expand the requirements. I want the dimensions of each item to be identical, let's say a square. I also want each item to be as close to a specific size as possible, but scaled up or down slightly to allow each row of items to exactly fit the width of the containing element. With the exception of the last row, which is allowed to be unfilled.
You can nearly do this with flexbox. The only problem is that the elements in the last row will be stretched to fill the row if it's short a few items. It's also fairly awkward ensuring the height of an element matches it's width, the current solution seems to be a hack involving padding-bottom.
I'm planning on trying out http://gridstylesheets.org/ to see if it's expressive enough for what I want. Of course, the catch is that I'm still depending on JavaScript.
I also recommend this guide which is very visual and helped me a lot: http://css-tricks.com/snippets/css/a-guide-to-flexbox/
Internet Explorer, as usual, screws everything up. No support in IE8 and IE9, limited support in IE10.
Just last month I started using it on a production application for the first time. We all talk about the web moving fast, but 4 years is a long damn time to have to wait. Especially considering I was doing a lot of WPF/Silverlight at the time as well and this type of layout support was built in from the start.
Anyone aware of any large sites using Flexbox that has non-tech users, e.g. Netflix or a major ecommerce site? I ask because I'd like to see any presentations or write-ups those guys may have written about their experience.
Please?
I'm lucky enough to work for a company with a last-2-versions support policy for IE, meaning IE10 and 11 are all I have to worry about. I can't understate how much nicer it makes web development. So much of the bad reputation of web technologies stems from wrestling bugs in old versions of IE and the lack of proper layout capabilities in CSS.
Can the author elaborate?
http://www.netmarketshare.com/browser-market-share.aspx?qpri...
Let's hope Windows 10 is a huge hit.
