JSFiddle - React, Tailwind, and code Playground

by Boris Šuška

HTML

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<!-- One column -->
<div class="row">
    <div class="col-xs-12">
        <div class="inner red">1</div>
    </div>    
</div>
<!-- Two columns  -->
<div class="row">
    <div class="col-xs-6">
        <div class="inner red">1</div>
    </div> 
    <div class="col-xs-6">
        <div class="inner red">2</div>
    </div> 
</div>
<!-- Three columns  -->
<div class="row">
    <div class="col-sm-4">
        <div class="inner red">1</div>
    </div> 
    <div class="col-sm-4">
        <div class="inner red">2</div>
    </div> 
    <div class="col-sm-4">
        <div class="inner red">3</div>
    </div> 
</div>
<!-- Four columns  -->
<div class="row">
    <div class="col-xs-3">
        <div class="inner red">1</div>
    </div> 
    <div class="col-xs-3">
        <div class="inner red">2</div>
    </div> 
    <div class="col-xs-3">
        <div class="inner red">3</div>
    </div> 
    <div class="col-xs-3">
        <div class="inner red">4</div>
    </div> 
</div>
<!-- six columns  -->
<div class="row">
    <div class="col-sm-2">
        <div class="inner red">1</div>
    </div> 
    <div class="col-sm-2">
        <div class="inner red">2</div>
    </div> 
    <div class="col-sm-2">
        <div class="inner red">3</div>
    </div> 
    <div class="col-sm-2">
        <div class="inner red">4</div>
    </div> 
    <div class="col-sm-2">
        <div class="inner red">5</div>
    </div> 
    <div class="col-sm-2">
        <div class="inner red">6</div>
    </div> 
</div>
<!-- twelve columns  -->
<div class="row">
    <div class="col-xs-1">
        <div class="inner red">1</div>
    </div> 
    <div class="col-xs-1">
        <div class="inner red">2</div>
    </div> 
    <div class="col-xs-1">
        <div class="inner red">3</div>
    </div> 
    <div class="col-xs-1">
        <div...

CSS

.row {
    margin-bottom: 5px;
}
.inner {
    min-height: 25px;
}
.red {
    background: red;
}
.blue {
    background: blue;
}
.green {
    background: green;
}