Grids

Grids are 2D layout used for displaying content along rows and columns.

Grid 30-70 layout

Use this layout to divide the container into 30% and 70% columns respectively. Add grid-30-70 class to the container to use this layout.

Hello, Ms. Jane

You have 7 new notifications pending. Have a look at them.

Refer the below code to use the above grid layout. Make changes as per your requirements.

Grid 50-50 layout

Use this layout to divide the container into two equal columns. Add grid-50-50 class to the container to use this layout.

Hello, Ms. Jane

Welcome to your profile.

Refer the below code to use the above grid layout. Make changes as per your requirements.

Grid-3 Column layout

Use this layout to divide the container into 3 equal columns. Add grid-3 class to the container to use this layout.

Refer the below code to use the above grid layout. Make changes as per your requirements.