O'Reilly logo

Learning Web Development with React and Bootstrap by Mehul Bhatt, Harmeet Singh

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Bootstrap grid system

Bootstrap is based on a 12-column grid system which includes a powerful responsive structure and a mobile-first fluid grid system that allows us to scaffold our web app with very few elements. In Bootstrap, we have a predefined series of classes to compose rows and columns, so before we start, we need to include the <div> tag with the container class to wrap our rows and columns. Otherwise, the framework won't respond as expected because Bootstrap has written CSS which is dependent on it and we need to add it below our navbar:

<div class="container"><div> 

This will make your web app the center of the page as well as control the rows and columns to work as expected in response.

There are four class prefixes which help to define ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required