How to adjust gutter in Bootstrap 3 grid system?

Question

The new Bootstrap 3 grid system is great. It\'s more powerful for responsive design at all screen sizes, and much easier for nested.

But I have one issue I could not

Answer 1

(Posted on behalf of the OP).

I believe I figured it out.

In my case, I added [class*="col-"] {padding: 0 7.5px;};.

Then added .row {margin: 0 -7.5px;}.

This works pretty well, except there is 1px margin on both sides. So I just make .row {margin: 0 -7.5px;} to .row {margin: 0 -8.5px;}, then it works perfectly.

I have no idea why there is a 1px margin. Maybe someone can explain it?

See the sample I created:

Demo
Code