Tuesday, 22 March 2016

Bootstrap Column : lg, md, sm

Looking at the Apple.com, the 4 panels below the hero changes 3 times according to device's width. So without further ado, lets dive into the concept and code.

<section id="featured-apps">
<div class="container-fluid">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6 box">
1
</div><!-- col -->
<div class="col-lg-3 col-md-6 col-sm-6 box">
2
</div><!-- col -->
<div class="col-lg-3 col-md-6 col-sm-6 box">
3
</div><!-- col -->
<div class="col-lg-3 col-md-6 col-sm-6 box">
4
</div><!-- col -->
</div><!-- row -->
</div><!-- container -->
</section><!-- featured-apps -->

No comments:

Post a Comment

It's 2019

Welcome the new year of 2019. It has been so thrilling inside information technology industry specifically in the mobile app industry. T...