Flex flavor (w/ webkit prefixes)

[sherbrow]

The flex flavored version as I think it would allow a lot more than mere tables.

Safari is till using prefixes but that's not too problematic I guess : Can I Use Flex

Added a doc page too (a copy of the index.html) and it would be even better if it explained the flex version and a few of the very useful flex properties (maybe even a .css with classes to apply those properties to the rows and cols).

http://sherbrow.github.io/ungrid/flex.html

[hsleewis]

👍 awesome!

@chrisnager is this something you want to add as an extra "option" in ungrid?

[chrisnager]

@sherbrow Thanks for the contribution! This is outstanding work. Let me review to see if this could be an appropriate alternative layout option for ungrid. (cc: @hsleewis)

[sherbrow]

Any news ?
It's all right if you don't want to merge and associate flex with ungrid, I'll create a whole different project and we can link back to each project for appropriate guiding.

[rkusa]

Hi @sherbrow, I've just noticed that the column widths are not distributed evenly with using flex-grow: 1 (instead of flex: 1). Example: http://codepen.io/anon/pen/gpBvma

Adding an additional flex-basis: 0 seems to help (or replace flex-grow with flex: 1 0 0).

[rkusa]

Maybe worth adding: another nice way for specific column widths: flex-grow: 1.5, flex-grow: 2, ... (take 1.5 times, take 2 times, ... the place compared for flex-grow: 1 (or flex-grow: .1 to think the other way around, ie. 10% width)

[sherbrow]

@rkusa It is the expected behavior of flex, a little like table cells that adapt to their content.
When you'd really want alignment whatever the content is, I guess you would use the flex basis to fix the size of the columns (% size for example).

I'm not sure forcing the basis to 0 is the best default behavior, even considering it is the default value of the flex shorthand.

About flex-grow values, if people wanted weighted columns, they might not get what they want from a minimized css grid.
The direction, wrapping, alignment, and eventually ordering, are really nice out-of-the box properties though that I think should complete all that.

[rkusa]

@sherbrow Thanks for the response! Yes it is, I just wanted to note that the current behaviour is different from that of ungrid using the table layout approach (with fixed table layout).
I agree that people probably don't get the expected behaviour using proportional values for the size.

[hsleewis]

@chrisnager have you had the time to review? :-)

[chrisnager]

I chose to keep ungrid a purely table-based CSS grid system. I added a flexbox flavor of ungrid similar to yours in the README and included a reference to your pull request.

@sherbrow Thank you for your contributions and apologies on the late decision.

[sherbrow]

@chrisnager Thank you for the late effort ! Very much appreciated ;)