JSFiddle - React, Tailwind, and code Playground
by sperske
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap.min.css">
<span id='viewWidth'></span>
<br />
<br />
<br />
<div class="container">
<div class="row">
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>A</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>B</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>C</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>D</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>E</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>F</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>G</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>H</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>I</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>J</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>K</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>L</p>
</div>
</div>
</div>
<br />
<br />
<br />
<div class="container">
<div class="row">
<div class="col-xs-4 col-sm-4 col-md-4 col-lg-4">
<p>A</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>B</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>C</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>D</p>
</div>
<div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
<p>E</p>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1">
<p>F</p>
</div>
<div...
JavaScript
var width = $('#viewWidth');
$(window).resize(function() {
width.html($(this).width()+'px')
})