According to Bootstrap, grid systems are used for creating page layouts through a series of rows and columns that house your content. Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. There are four main grid sizes : Extra Small devices (col-xs-) : phone Small devices (col-sm-) : tablet Medium devices (col-md-) : desktops Large devices (col-lg-) : desktops The instructor shows us how to build a responsive grid system. After we link the bootstrap css file, we are going to create the grid system on the body part. Since grid systems only scale up to 12 columns, we can create layouts in different units. In the HTML, we create a "container" first, so the grid system will be inside the container. Then we create a class attribute value equal "row" in the div tag, so all units will stay in one row just like the table data stay in the table row. And ...