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