Flexbox vs. CSS Grid — Which is Better?



https://i.ytimg.com/vi/hs3piaN4b5I/hqdefault.jpg



One of the most commonly asked questions about CSS Grid is “Does CSS Grid replace Flexbox? Is it better than Flexbox? Should I use it instead of Flexbox?” The answer is no — we will use both Grid and Flexbox on most sites, along with flow content, floats, and other CSS for layout. This video explains the differences between Flexbox and Grid, and when to use which one.

Original source


29 responses to “Flexbox vs. CSS Grid — Which is Better?”

  1. Thank you very much for that awesome lecture video.
    I have one question / suggestion and one point that I don't aggree with it:
    1. The question:
    I would compare CSS Grid with C# .NET WPF GUI applications and / or with the Java SE GridBagContainer Layout. We know this things for many years in classical PC programming languages as mentioned right in the sentence before. I loved those methods on layouting and I love to see it now as well in the web. That really simplifies things. I hope, we can integrate old browsers using Transpilers or PostCSS. My question is: Do you know if the CSS Grid is 1 to 1 compareable with the .NET WPF and Java SE GridBagContainer?

    2. The point that I disagreee (because I did it already successfully):
    Indeed you are able to let overlap images using flexbox. Let's say you want to have a small image and a large on in the background. That works simply by using z-index and by using some flex properties on the CSS selectors. Another point to think about it: Is overlapping images, that next to each other not simply done by negative margins or paddings?

  2. Thats what really what i wanted to know. Thanks. I need to experiment more because i get so many different type of psds and using grid and using basic css mixed might be good. I dont know if they work togather on IE. I hope i dont have to use shive or some html5 css3 compatibility js.

Leave a Reply