html - bootstrap grid for mobile layout -


i have following markup

<div class="container">   <div class="row">     <div class="col-sm-8">       content     </div>     <div class="col-sm-4">       sidebar     </div>   </div>       <div class="row">     <div class="col-sm-8">       content     </div>     <div class="col-sm-4">       sidebar     </div>   </div>  </div> 

how can have content section sit on top of sidebar mobile view? example above markup ill following in mobile view (stack)

<div class="col-sm-8">   content </div> <div class="col-sm-4">   siderbar </div> <div class="col-sm-8">   content </div> <div class="col-sm-4">   siderbar </div> 

but want achieve following mobile view

<div class="col-sm-8>   content </div> <div class="col-sm-8">   content </div> <div class="col-sm-4">   sidebar </div> <div class="col-sm-4">   sidebar </div> 

i've seen done before forgot. everyone

after multiple attempts of experimenting found way.

i decided remove 1 whole row , squeeze contents in col-sm-8 , sidebar content in col-sm-4

<div class="col-sm-8">  content  content </div> <div class="col-sm-4">  sidebar  sidebar </div> 

Comments

Popular posts from this blog

java - UnknownEntityTypeException: Unable to locate persister (Hibernate 5.0) -

python - ValueError: empty vocabulary; perhaps the documents only contain stop words -

ubuntu - collect2: fatal error: ld terminated with signal 9 [Killed] -