Social Proof Section Solution using HTML and CSS by Mycah

Hey Mycah,

Nice work on this project 👏

Using bootstrap grid or css grid, it really depends on the project 🤔.

If you really care about the page loading speed and the project size:

Using CSS grid.

Bootstrap is a big framework, it will increase the size of your page and slow down the page loading speed (however, you can use purgecss to remove the unused css https://github.com/FullHuman/purgecss).

For a large size multi pages project, using a css framework is totally fine 🙆‍♂️. But for a small size project (like this one), I would choose 👉 the plain css.

If the size doesn't matter:

Bootstrap is easier to learn and use, but harder to modify.

CSS grid is harder to understand at the beginning, but once you master it, it is more flexible.

Here is a document from MDN might help for learning css grid: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout

And CSS grid cheat sheet: https://yoksel.github.io/grid-cheatsheet/

If the layout is just a one-column or one-row, then you don't even need grid. CSS flexbox will handle all for you😎.

Flex cheat sheet: https://yoksel.github.io/flex-cheatsheet/

Happy coding 🙌!

For space between cards, when using grid and flexbox you can use justify-content, for grid you can use grid-gap.