flexboxgrid space without paddings and negative margins

Using justify-conten:space-between to handle the space. External ressources here are flexboxgrid.css and normalize.css.

HTML

<link rel="stylesheet" href="https://rawgit.com/kristoferjoseph/flexboxgrid/master/dist/flexboxgrid.min.css">
<div class="row">
    <div class="col-xs-4">box 1</div>
    <div class="col-xs-4">box 2</div>
    <div class="col-xs-4">box 3</div>    
</div>

CSS

/* overwrite */

.col-xs-4 {
    flex-basis: calc(33.333% - 1rem);
}
.row {
    margin: 0;
}
.row div {
    padding: 0;
    max-width: none;
}

/* beautify */
.row {
    background-color: lightgray;
}
.row div {
    background-color: lightyellow;
    border: 1px solid lightcoral;
    text-align: center;
}