3 ms·
> This is the use for one I’ve written: see the responsive design of the hero area on https://www.topicbox.com/ https://www.topicbox.com/ and how the video move
by SahAssar 7y ago
> This is the use for one I’ve written: see the responsive design of the hero area on https://www.topicbox.com/ https://www.topicbox.com/ and how the video moves from the right into the middle of the content from the left column, which would be exceedingly painful to handle well without Grid, probably requiring absolute positioning and/or float.
Wouldn't just flex ordering and wrapping do? like this: https://codepen.io/anon/pen/QRgoOR https://codepen.io/anon/pen/QRgoOR
- chrismorgan 7y agoIt depends on how thoroughly the widths and heights are known. In various constrained cases, what you suggest can work, but it’s always fragile and depends on certain layout constraints being met. I do like your use of the column direction and vertical wrapping; for some reason, I had always had in mind rows, which prevents you from doing things like vertical centring of the columns relative to one another. So I never did try that combination. I think it would narrowly meet our requirements now (which includes other landing pages with somewhat different hero content), but I don’t think it would have the first iteration of the design when I started using Grid, due to greater flexibility and variation of the heights of elements. At the least, the Grid solution is more robust. But I will downgrade my “exceedingly painful” judgement to “somewhat icky and fairly fragile”. Thanks for also supporting my point that most cases where Grid is used can be done with Flexbox!