Bootstrap 5 Grid System


Saturday, December 21, 2024    |    283 views

Bootstrap's grid system is built with flexbox and allows up to 12 columns across the page.

The Bootstrap 5 grid system has six classes:
    .col- (extra small devices - screen width less than 576px)
    .col-sm- (small devices - screen width equal to or greater than 576px)
    .col-md- (medium devices - screen width equal to or greater than 768px)
    .col-lg- (large devices - screen width equal to or greater than 992px)
    .col-xl- (xlarge devices - screen width equal to or greater than 1200px)
    .col-xxl- (xxlarge devices - screen width equal to or greater than 1400px)

 

Creates three equal-width columns across all devices and viewports using our predefined grid classes.

<div class="container">
  <div class="row">
    <div class="col">      Column    </div>
    <div class="col">      Column    </div>
    <div class="col">      Column    </div>
  </div>
</div>

 

 


Post Comments
649688