Layout Demo

Comparison of CSS Flexbox and CSS Grid

Code is not 100% clean, intention was to compare the experience of building HTML Layout with these two different Tools.

Conclusion

• CSS Grid let you build 2-dimensional Layouts
• The Structure is build with managing an Element Structure in HTML if you use Flexbox
• CSS can be a lot faster when using Grid-Areas
• Grids should be used for global Structuring
• Aligning Items in a Container is probably done faster with Flexbox