I am using Bootstrap 3 in few of my projects, especially the container-fluid class to make my page to display properly in all devices automatically. I know the following regarding the col-xx class: xs for < 768px, sm for >- 768px, md >= 992px and lg for >= 1200px. Let us say I have the following code:
<div class="container-fluid">
<div class="row">
<div class="col-sm-4">
Content 1
</div>
<div class="col-sm-8">
Content 2
</div>
</div>
</div>
I believe in smart phones both Content 1 and 2 will occupy full screen and In all other devices Content 1 will occupy 4 columns and Content 2 will occupy 8 columns. If so, what is the need for md and lg? Probably I don't understand the concept correctly. Instead, should I use class="col-sm-2 col-md-2 col-lg-2" and class="col-sm-8 col-md-8 col-lg-8" in both the div's so that it will work fine in all devices?
Thanks
Aucun commentaire:
Enregistrer un commentaire