The motive of this article is to align the content into four columns where the first two columns denote the labels and its content and the last two columns denote the labels and its content. The class “row” and “col” are used to create a grid which can be represented by a number of rows and columns. The class “row” creates a row into which the content will be placed and the class “col” creates partitions in that row making space for 4 labels or 4 items to be placed in that row.
This example uses Bootstrap to create four columns where the first two columns represent the labels and its content and the last two columns represent the labels and its content.
- Bootstrap (Part-8) | Badges, Labels, Page Headers
- CSS | align-content property
- How to align content of a div to the bottom using CSS ?
- How to align buttons in Card footer in Bootstrap ?
- How to create five equal columns in Bootstrap ?
- How to accordion scroll to top to open content in Bootstrap ?
- Bootstrap | Close Icon for dismissing content with Examples
- Include Bootstrap in AngularJS using ng-bootstrap
- CSS | Align
- CSS | align-self Property
- HTML | <td> align Attribute
- HTML | <tr> align Attribute
- CSS | vertical-align Property
- HTML | <hr> align Attribute
- CSS | text-align-last Property
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.