FremyCompany / css-grid-polyfill

A working implementation of css grids for current browsers.
MIT License
1.11k stars 82 forks source link

Support the repeat(auto, ....) feature once the spec is sane about it #14

Open FremyCompany opened 9 years ago

FremyCompany commented 9 years ago

Not sure whether it means I've to push for a spec change even more... or if I should just wait for @tabatkins and @fantasai to work on it on their own, and do something else of my free time than discuss about css-grid ^_^

Anyway, see #13 for more details on the background of this issue.

If you want to get this issue fixed for whatever reason, please comment here. I'll use the comments to prioritize my future work.

FremyCompany commented 9 years ago

It was resolved by the css working group to add an auto-fit behavior to the "repeat(auto)" feature. The feature has also been clarified regarding what should or should not be possible. Implementation work could technically start on this now (translation: when I've some free time to work on this).

Thanks @tabatkins and @fantasai for thinking this through and making the formal proposal, btw!

woky commented 9 years ago

Hello.

If you want to get this issue fixed for whatever reason, please comment here. I'll use the comments to prioritize my future work.

I've just hoped to use auto-fill (or auto-fit) in Chrome with Experimental Web features flag enabled but unfortunately it's not yet supported there. I guess I'll try the <table> in the meantime. My use-case is kind of a button grid that uses full width and height of the viewport.

Thank you.

FremyCompany commented 9 years ago

Could you share a screenshot once you're done? Just trying to assess how people use it in practice.

woky commented 9 years ago

Hi.

Basically I wanted a dynamic button grid that will fit the viewport. I managed to something similar with flex:

http://sprunge.us/ZfNb

I wanted to try the grid layout with repeat(auto-fill, ...) feature because I want the final layout to look like grid even if contained elements have different intrinsic dimensions, which I cannot do with the flex layout:

That is, in the last example I wanted the C to start a new row and B having same dimension as Abcdef. Anyway, I'm satisfied with this.

yisibl commented 8 years ago

Firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1118820

yisibl commented 8 years ago

Firefox 46 support. :ghost: