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

Wireframing

I cannot stress enough that for client project wireframing is important. If don't have let's make it have it. Because we will be...