This is what Webvisuals.com uses for it’s content layout solution in a responsive tsunami world.

The CSS

/* experimental */
.grid {
    @include clearfix;
 /*    margin: 0 -1.5em;*/
}
.grid-unit {
    box-sizing: border-box;
    display: block;
    float: left;
  /*  padding: 0 1.5em;*/
    width: 100%;
    background-color:#ccc;
    border: 3px dotted #333;
    padding-left:25px;
}
.layout .grid-unit {
    width: 20%;
}
.grid-unit.blue {
  background-color:#3399FF;
  color:#FFF; 
}

@media screen and (min-width: 40em) {
    .home-features .grid-unit {
        width: 50%;
    }
}
@media screen and (min-width: 60em) {
    .home-features .grid-unit {
        width: 33.33%;
    }
}
/* end experimental */

And the HTML to lay it out