Nested rows that ignore gutter

[ogbaoghene]

Hi,

I see you have established a way to use nested rows but how about but how about nested rows that ignore gutters? Normally this is done using negative margins but there doesn't seem to be any neat way to use those alongside display: table.

[liantics]

I'm not sure if this is exactly what you're looking for, ogbaoghene, but there's a demo, here, for stripping the gutters from a row in bootstrap 3: http://www.bootply.com/107708

I found it in this stack overflow discussion (which was oriented toward earlier versions of bootstrap): http://stackoverflow.com/questions/16489307/how-to-remove-gutter-space-for-a-specific-div-only-bootstrap

[ogbaoghene]

@liantics will take a look. Thanks a lot.

[chrisnager]

@ogbaoghene not sure if this addresses your issue, but here's an example of how you can use gutters with ungrid: http://codepen.io/chrisnager/pen/arKBu

[ogbaoghene]

Actually it doesn't but thanks @chrisnager. Looking for an alternative to inline-block as a flexbox fallback.

[yckart]

@chrisnager If you add the gutter-size also as margin to body (or any other appropriate parent), the overflow problem should be fixed ;)

body {
  margin: gutter-y gutter-x;
}

.container {
  margin: -gutter-y -gutter-x;
}

.row {
  border-spacing: gutter-x gutter-y;
}