Bootstrap 3 - Nth Row

by Kyle Mitofsky

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css">
<section class="container">
    <div class="row thumbs">
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
        <div class="col-sm-3">content</div>
    </div>
    <div class="navigation">navigation</div>
</section>











<!-- Post Info -->
<div style='position:fixed;bottom:0;left:0; background:lightgray;width:100%;'>
    About this SO Question:
    <a href='http://stackoverflow.com/q/26326551/1366033'>
        How to close a bootstrap row and start new row after every nth containing div
    </a><br/>
    Fork This Skeleton Here: 
    <a href='http://jsfiddle.net/KyleMit/kcpma/'>
        Bootstrap 3 Skeleton
    </a><br/>
</div>

CSS

.container .row.thumbs div:nth-child(4n) {
    position: static;
}
.container .row.thumbs div:nth-child(4n):after {
    content: ' ';
    border-top: 1px solid black;
    display: block;
    position: absolute;
    width: 95%;
    margin-left: 2.5%;
    left: 0;
}