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
Post a Comment