0

Bootstrap grid spacing is not working properly.

Jeroen
  • 1,168
  • 1
  • 12
  • 24
Amoro
  • 65
  • 6
  • 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 Answers2

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>
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