JSFiddle - React, Tailwind, and code Playground

by Hamilton Turner

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<div class="container-fluid">
<div class="panel panel-default">
  <div class="panel-body">
    
    <!-- Nav tabs -->
    <ul class="nav nav-tabs" role="tablist">
        <li>
          <a href="#p1" class="btn btn-primary" role="tab" data-toggle="tab">
              <span class="glyphicon glyphicon-cloud"></span>
          </a>
        </li>
        <li>
          <a href="#p2" class="btn btn-primary" role="tab" data-toggle="tab">
              <span class="glyphicon glyphicon-cloud"></span>
          </a>
        </li>        
    </ul>
      
    <!-- Tab panes -->
    <div class="tab-content">
              
      <!--Open Panel Controls-->
      <div class="tab-pane active" id="p1">
          <div class="row">
              <div class="column-md-4" style="background: green;">
                  This is my first column
              </div> <!-- /col emulator-->
              <div class="column-md-1">
              These are buttons
              </div>
          </div> <!--/row-->
      </div>
    
      <div class="tab-pane" id="p2">
          <div class="row">
              <div class="column-md-4" style="background: red;">
                  This is my first column, page 2
              </div> <!-- /col emulator-->
              <div class="column-md-1">
              These are buttons, page 2
              </div>
          </div> <!--/row-->
      </div>

      </div> <!-- /tab-content -->
      
    </div> <!-- /panel-body -->
    </div> <!-- /panel>
</div> <!-- /container-fluid -->

      
    <script src="/scripts/bootstrap.min.js"></script>