用拉和推換換div

Question

我一直在閱讀很多文檔，但我不能成功地重新安排一些divs命令。這是我的代碼

<div class="container"> 

    <div class="row"> 
     <div class="col-md-11"> 
      <div class="slider"> 
       The slider 
      </div> 
     </div> 
     <div class="col-md-5"> 
      <nav class="main-menu"> 
       The Menu 
      </nav> 
     </div> 
    </div> 

</div> 

當屏幕進入sm時，我希望菜單在滑塊（都是16列大小）上方。可能嗎？

Answer 1

使用Flexbox的：

.row { 
    display: flex; 
    flex-direction: column; 
} 

@media (max-width: 500px) { 
    .row > div:first-child { 
    order: 2; 
    } 
} 

http://codepen.io/antibland/pen/aNRZRJ