Reduce gutter size in bootstrap 3

Default is 30px, and I want to reduce it, let’s say to 5px. I saw some topics using code such as

.row.no-gutters {
margin-right: 0;
margin-left: 0;
}
.row.no-gutters > [class^=“col-”],
.row.no-gutters > [class*=" col-"] {
padding-right: 0;
padding-left: 0;
}

And put no-gutters class in HTML code. But when I changed those value to 5px, or -25px, it seems adding more space into gutter size, or no change at all. Wondering what is the correct way to reduce gutter size in bootstrap 3?

Thanks a lot.

Could you throw together a quick demo for us? So we don’t have to download bootstrap and guess at your HTML structure (and make the assumption that’s the only custom CSS you’ve done) :slight_smile: .

div[class*=“col”]{padding-left:5px; padding-right:5px;}

Above code is working for me eventually.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.