JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.min.css">
<div class="container">
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>1</h2><span>ffffff<br>dfgfdgf</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>2</h2><span>ffffffff</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>3</h2><span>ffffff</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>4</h2><span>ffffffff<br>dfgf<br>dfgfdgf</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>5</h2><span>fffffff</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>6</h2><span>ffffffff</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>7</h2><span>ffffff<br>dfgfdgf</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>8</h2><span>ffffffff</span></div>
<div class="col-xs-6 col-sm-4 col-md-3 col"><h2>9</h2><span>ffffff<br>dfgfdgf<br>dfgfdgf<br>dfgfdgf</span></div>
</div>
CSS
.container {
padding:0;
}
span{
background-color:red;
display:block;
}
JavaScript
function resizer() {
var $width_container = $('.container').width(),
$width_item = $('.col:eq(0)').width(),
$count_in_row = parseInt($width_container / $width_item),
$count_items = $('.col').length,
$rows_count = $count_items / $count_in_row,
$n = 1;
$('.col').each(function (i) {
if ($n % $count_in_row == 1) {
$(this).find('h2').html('start');
} else if ($n % $count_in_row == 0) {
$(this).find('h2').html('finish');
} else {
$(this).find('h2').html('xxx');
}
$n++;
});
}
resizer();
$(window).resize(function(){
resizer();
})