Bootstrap Remove Column Gutter Padding (Version 5)

Bootstrap4 Bootstrap3

Bootstrap5: Zero gutter is g-0

Boostrap5 comes with gutter utilities

  • Catch all dimensions & viewports g-0 .. g-5
  • Responsive Viewports g-sm-0 .. g-lg-5 which lets you set the gutter on mobile/desktop
  • horizontal & vertical modifier gy-0 .. gx-5 allows for changing gutter in either direction.

A desktop-only vertical gutter would look something like gy-sm-5

Code sample with zero-gutter width:

<div class="container">
  <div class="row g-0">
    <div class="col-6">
      <div class="p-3 border bg-light">...</div>
    </div>
    <div class="col-6">
      <div class="p-3 border bg-light">...</div>
    </div>
  </div>
</div>