About
The UI - Column system in Bootstrap is build with CSS - Flex Box
Syntax
- ClassName Syntax
col
/* or */
col-{length}
where:
- length is number between 0-24 that defines the length weight of the column
Example
For a 12 columns grid, col-8 will take 2 more space than a col-4
.row {
border: 1px solid #ccc;
background-color: #ddd;
padding-top: .75rem;
padding-bottom: .75rem;
}
<div class="row">
<div class="col">col</div>
<div class="col">col</div>
<div class="col">col</div>
<div class="col">col</div>
</div>
<div class="row">
<div class="col-8">col-8</div>
<div class="col-4">col-4</div>
</div>