Bootstrap - Grid Demo

What is a Grid?

In graphic design, a grid is a structure (usually two-dimensional) made up of a series of intersecting straight (vertical, horizontal) lines used to structure the content. It is widely used to design layout and content structure in print design. In web design, it is a very effective method to create a consistent layout rapidly and effectively using HTML and CSS.

Working of Bootstrap Grid System

Grid systems are used for creating page layouts through a series of rows and columns that house your content. Here's how the Bootstrap grid system works −

• Use rows to create horizontal groups of columns.

• Content should be placed within the columns, and only columns may be the immediate children of rows.

• Use the .themed-grid-col class to add some theming to the columns. This is not a default Bootstrap class.

• Create a grid with equal columns using .row-cols-* classes.

• Padding is used in columns to create gutters (gaps between column content). That padding is offset in rows using a negative margin on .rows for the first and last column.

Kickstart Your Career

Get certified by completing the course

Get Started