What's is the difference between FlexBox, Bootstrap and CSS grid?

I’m a newbie in web development (been studying HTML and CSS for two weeks now) and I honestly don’t know what Bootstrap, FlexBox and CSS grid is and what they are used for … Your contributions will be highly appreciated, thanks.

1 Like

Bootstrap is a framework that is separate from the css and html specs. It is basically an independent set of tools that combine html css and JS into predefined patterns that can be used to create web pages. It gives a systematic approach with predefined utility classes to create common web patterns.

Flexbox and css grid are part of the css specs and just another set of css properties that help construct layouts. They are great tools for laying out pages and can be used to create quite complex layouts more easily than was previously possible.

Learn html and css first and then you won’t need a framework like bootstrap although in large projects with multiple developers a framework can help organise things consistently.

4 Likes

Ok thanks… Betweens FlexBox and CSS grid which one is the better and more easier to use?

Well it’s not so much a choice as to which to use but more importantly which one is best suited to the task in hand.

Flexbox lays out flexible columns but does not specifically match rows and columns together (unless they are specifically sized with that in mind).

CSS grid lays out columns and rows but allows a relationship between columns and rows to exist.

Grid and flexbox are not mutually exclusive either. Generally you would create a grid structure using css grid but internal elements may well be laid out using flexbox.

Some layouts may need neither of the above.

Flexbox is a little easier to learn than grid but both are pretty complex because of the comprehensive set of functions they support. It’s not a 5 minute job to learn and you do need to be comfortable with the basic css properties.

Flexbox and grid are just another more comprehensive set of layout tools than were previously available in css. I use flexbox a lot but I still use display table a lot also.

3 Likes