flakes gridforms demo product description does not handle verticle scaling on firefox nightly

[libliflin]

1. go to http://kumailht.com/gridforms/
2. type d d d into product description.
3. see scroll bar.
4. expand field vertically with lower right toggle. see form respond by moving SKU's row down.
5. do the same on http://getflakes.com/preview/grid-forms.html and form does not respond. d's are overlayed on top of SKU

[theZieger]

I have discovered the same behaviour in Chrome 39.

[lookfirst]

But, if you resize the whole window, then it updates and things look ok:

screenshot: http://take.ms/trgBl

[theZieger]

This behaviour corresponds to the gridforms.js equalizeFieldHeights function Line 73: fieldRow.find(fieldsContainers).css('height', rowHeight);

Q: Is this really needed? I think this could be fixed with proper CSS. Or is this JS a essential part of something I don't get?

[kumailht]

It's this line here that's causing this bug: https://github.com/kumailht/gridforms/blob/master/gridforms/gridforms.js#L73

@libliflin The GridForms hopepage is still using a slightly older version of the JS that does not have this bug.

@theZieger You might be right. Here is the trail of pull requests that led to this change: https://github.com/kumailht/gridforms/pull/2 https://github.com/kumailht/gridforms/pull/5 https://github.com/kumailht/gridforms/pull/8

[theZieger]

@kumailht Ok now I get the problem with the gaps on smaller screens. The only solution I know to fix this (with CSS only) would be flexbox. Or I think using display: table; in some way (what looks kinda ugly/hacky to me).

Would love to see the flexbox approach. And if you don't care about IE9 (or lower) and Opera Mini support (caniuse.com) I would recommend it.

[kumailht]

Flexbox might be a good idea. The browser support might be a problem though.

[theZieger]

Setting style="min-height: XYZpx;" would be the easiest to fix the problem. I would propose a pull-request after the next weekend for this if you don't mind.

@kumailht What do you think about using flexbox in the first place and setting the min-height approach as a fallback for older browsers?

[kumailht]

Yeah, a pull request would be great!

Honestly, I know very little about flexbox so I wouldn't be able to answer that. You can make a judgement call on that. I'll test the pull request out and if it works reliably, I'll merge it.

What do you say?

[theZieger]

Sounds great.