4 Ways to define layout in CSS
Layout in CSS makes your content sit in a row or column. A Flexible layout helps to fit more content in less space.
Below are the ways in CSS to make the flexible layout in CSS:
|Sr#||First Column||Second column||Third column|
|1.||Table||Table are used to structure large amount of data in column and rows. Table is the HTML way to layout the data.||Read more about HTML table →|
|2.||Floats||Floats remove the HTML element from the normal flow of the page.||Read more about CSS Floats →|
|3.||Flexbox||Flexbox allow the content to sit side-by-side||Read more about CSS Flexbox →|
|4.||Grid||CSS grid is the most powerful layout system for 2-dimension.||Read more about CSS Grid →|
We can use any technique as discussed above to create any kind of layout (either 1-dimension or 2 dimensions).
For a 2-dimensional layout, we can prefer a CSS grid to make our code small. But not every browser supports a CSS grid. We can search for browser compatibility at caniuse.com.