JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="row-fluid">
    <div class="col-xs-4">
        <div class="myClass">
            <div class="row">
                <div class="col-sm-4">TEST 1</div>
                <div class="col-sm-4">TEST 2</div>
                <div class="col-sm-4">TEST 3</div>
                <div class="col-sm-4">TEST 4</div>
            </div>
        </div>
    </div>
    <div class="col-xs-4">
        <div class="myClass">
            <div class="row">
                <div class="col-sm-4">TEST 11</div>
                <div class="col-sm-4">TEST 12</div>
                <div class="col-sm-4">TEST 13</div>
                <div class="col-sm-4">TEST 14</div>
            </div>
        </div>
    </div>
    <div class="col-xs-4">
        <div class="myClass">
            <div class="row">
                <div class="col-sm-4">TEST 21</div>
                <div class="col-sm-4">TEST 22</div>
                <div class="col-sm-4">TEST 23</div>
                <div class="col-sm-4">TEST 24</div>
            </div>
        </div>
    </div>

CSS

div.myClass {
    overflow-x: auto;
    white-space: nowrap;
}
div.myClass [class*="col"] {
    display: inline-block;
    float: none; /* Very important */
}

/* Test purposes */
.myClass .col-sm-4 { background: blue; margin-top: 5px;min-height: 50px; }

/*div.myClass {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}
*/