Bootstrap grid spacing is not working properly.
Asked
Active
Viewed 99 times
0
-
Possible duplicate of [twitter bootstrap grid system. Spacing between columns](http://stackoverflow.com/questions/18738712/twitter-bootstrap-grid-system-spacing-between-columns) – Will B. Aug 12 '16 at 19:59
-
this is not a duplicate thank you – Amoro Aug 12 '16 at 20:27
-
You should read the answers there as the solution to your problem is provided in multiple ways. Just not for your specific dimensions, which you should be able to determine from several of them. Including column nesting with 90 upvotes. – Will B. Aug 12 '16 at 20:35
-
i have read all the answers – Amoro Aug 12 '16 at 20:36
2 Answers
1
<div class="row">
<div style="padding-right:15px" class="col-lg-4"></div>
<div style="padding-right:15px" class="col-lg-4"></div>
<div class="col-lg-4"></div>
</div>

Akash Bhandwalkar
- 901
- 5
- 19
1
you can edit these spaces in bootstrap less file and recompile it. Right in variables.less
//== Grid system
//
//## Define your custom responsive grid.
//** Number of columns in the grid.
@grid-columns: 12;
//** Padding between columns. Gets divided in half for the left and right.
@grid-gutter-width: 30px;
makes in css:
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
.col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
.col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
.col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
.col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
.col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
.col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
.col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
.col-xs-11, .col-sm-11, .col-md-11, .col-lg-11,
.col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
position: relative;
min-height: 1px;
padding-left: 15px;
padding-right: 15px;
}

Honza
- 683
- 7
- 22