The 12-Column Responsive Bootstrap Grid
Bootstrap's grid system uses containers, rows, and columns to layout and align content. Built with Flexbox, it is fully responsive across mobile (xs), tablet (md), desktop (lg), and extra large (xl) screens.
html Example
<div class="container py-4">
<div class="row g-3">
<div class="col-12 col-md-6 col-lg-4">
<div class="card p-3 shadow-sm">Card 1</div>
</div>
<div class="col-12 col-md-6 col-lg-4">
<div class="card p-3 shadow-sm">Card 2</div>
</div>
<div class="col-12 col-md-6 col-lg-4">
<div class="card p-3 shadow-sm">Card 3</div>
</div>
</div>
</div>