Reorder Bootstrap Columns Vertically

by Kyle Mitofsky

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css">
<div class="container">
  <div class="row">
    <div class="col col-sm-6 a">
      <div>
        Section A
      </div>
      <div>
        More Info about Section A
      </div>
    </div>
    <div class="col col-sm-6 b">
      <div>
        Section B
      </div>
    </div>
  </div>
</div>














<div style='position:fixed;bottom:0;left:0; background:lightgray;width:100%;'>
  About these SO questions:
  <ul>
    <li><a href='https://stackoverflow.com/q/47186788/1366033'>
        How to reorder bootstrap columns on mobile - Vertically
    </a></li>
    <li><a href='https://stackoverflow.com/q/20171408/1366033'>
        How do I change Bootstrap 3 column order on mobile layout?
    </a></li>
    <li><a href='https://stackoverflow.com/q/18514922/1366033'>
        Reordering divs responsively with Twitter Bootstrap?
    </a></li>
  </ul>

</div>

CSS

.a,
.b {
  border: 1px solid lightgrey;
}

.a {
  color: green;
}

.b {
  color: blue;
}