JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<div class="col-xs-4 col-sm-4" style="height:100px;background:red;">A</div>
<div class="col-xs-8 col-sm-4 float" style="height:100px;background:blue">B</div>
<div class="col-xs-4 col-sm-4" style="height:100px;background:green">C</div>

CSS

@media (max-width: 768px) 
  { 
    .float
    {
      float:right!important;
    height:200px!important;
    } 
  }