5

Why does Bootstrap row element have margin-left: -15px and margin-right: -15px? When a row element is nested into a col-**-* element, it sticks out even on their official site. What is the best way to make a nested row not stick out from its parent col-**-*?

Link to the screenshot

  • 1
    This is so you don't get double padding on the inside of your `.container`, because `.container`'s have 15px padding on the left and right, just like the `col-`'s. – zgood Sep 27 '17 at 17:22
  • This article should help [The Subtle Magic Behind Why the Bootstrap 3 Grid Works](http://www.helloerik.com/the-subtle-magic-behind-why-the-bootstrap-3-grid-works) – dhiman Sep 27 '17 at 17:22
  • @dhiman The link is behind a password. – crash springfield Mar 23 '20 at 18:29

1 Answers1

0

You can overwrite bootstrap css rules by calling your custom stylesheet file after bootstrap's.

.row {
  margin: 0;
}

If you want to apply this only to rows nested into col-*

[class*=”col-”] .row {
  margin: 0;
}
Canta
  • 1,480
  • 1
  • 13
  • 26