Checkout Jen Simmons videos "layout land", mozilla designer advocate. https://www.youtube.com/watch?v=FEnRpy9Xfes&list=PLbSquHt1VCf1x_-1ytlVMT0AMwADlWtc1 https:

Checkout Jen Simmons videos "layout land", mozilla designer advocate. https://www.youtube.com/watch?v=FEnRpy9Xfes&list=PLbSquHt1VCf1x_-1ytlVMT0AMwADlWtc1 https://www.youtube.com/watch?v=FEnRpy9Xfes&list=PLbSquHt1VC... . She answers all the questions from a historical perspective who just gets what webdesign really is. Inforgraphics predated website designs, and art before that, she explains how this all ties into flexbox vs grid vs tables vs floats etc. You still use all 4 of them, but to different degrees depending on the situation. ------------------------------------------------------------------ Generally speaking, these are the rules I gather from my own personal experience and also Jen Simmons - Tables are inflexible for responsive webdesign, due to display:table-cell default values. Your table should be small, or be have horizontal support on lower viewport sizes - Floats are still useful for singular items, but sometimes can be replaced by using position absolute / position relative items. Floats are really good at dealing with existing CSS files or structure where you have no control over the backend (e.g. custom wordpress theming comes to mind, floats made most sense for post excerpt images when I remade my blog) - CSS Grid only shines on larger "macro" type of elements, where many nested child components will be inside. CSS Grid also is the only of these 4 for "stack overlapping" certain elements with each other. CSS Grid replaces the use of media queries and is less verbose. You can use CSS grid with @support for older browsers but most browsers are going to support CSS grid due to how fast it has been adopted over the past year. CSS grid is absolutely terrible for small-micro components though, CSS grid suffers from dealing with multiple different style pages rendered on backend (e.g. ecommerce product landing page, on the asides page), or things of unpredictablility. Using a combination of Flexbox, media queries, floats, position relative/absolute is much better here. You need to first and foremost think of what good HTML for a blind-impaired reader should look like for a screenreader perspective. CSS Grid you think in 2D mostly - Flexbox is still superior to CSS grid on smaller item sizes and subcomponents. Flexbox you think in 1D, but you treat flex-wrap as an added bonus. Flexbox is the most versatile for managing complex components ------------------------------------------------------------------ Basically, you use all 4. You pick one over the another in certain situations. Normally, if you adopt CSS grid, you do so from the beginning. You will almost always be using flexbox at somepoint or another for handling more complex subcomponents/wrappers, get used to it, unless your project is not complicated, then css grid suffices. Floats are great with mixing with flexbox and media queries, you can do almost everything CSS grid can minus the stackable layed out elements. Floats are far superior for doing theme editing after the fact and for quick-hacking on a wordpress theming layout etc. Tables just shine on tables that do not need responsive webqueries and for keeping the header and body reflowing at the same rate at different viewport sizes. But truthfully, tables offer no advantages over flexbox. Bulma I personally do not like, because classnames are too long, I'd rather go with bootstrap because of all the addin support / stackoverflow/ everything else resource I have access to over bulma. This is personal opinion of course, you choose what you want When you pick a CSS framework like Bulma, you need to decide how much you are going to use it. Personally, when I load in bootstrap, I use it for micro-components like buttons, panels etc because I simply am too lazy to write these myself. If you adopt Bulma's grid/rows/columns etc you might not be using much CSS grid at all, BUT you still will probably use flexbox every now and then Hopefully this naswers your question