There are 3 <div> :

 <div class="col-md-2 col-xs-12">блок 1</div> <div class="col-md-8 col-xs-12">блок 2</div> <div class="col-md-2 col-xs-12">блок 3</div> 

Tell me, please, how to make it so that when the screen width becomes xs , block 3 goes up, that is, it’s like this:

 <div class="col-md-2 col-xs-12">блок 3</div> <div class="col-md-2 col-xs-12">блок 1</div> <div class="col-md-8 col-xs-12">блок 2</div> 
  • I don't know about bootstrap, but flexbox is easy .. - user33274

1 answer 1

Column ordering

Example

 [class*=col-] { text-align: center; border: 1px solid #ccc; } 
 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> <div class="container"> <div class="row"> <div class="col-md-4 col-sm-4 col-xs-12 col-md-push-8 col-sm-push-8">3</div> <div class="col-md-4 col-sm-4 col-xs-12 col-md-pull-4 col-sm-pull-4">1</div> <div class="col-md-4 col-sm-4 col-xs-12 col-md-pull-4 col-sm-pull-4">2</div> </div> </div>