Bootstrap Question:

Please consider the following HTML code snippet:

<div class="row">
<div class="col-xs-12 col-md-3">.col-xs-12 .col-md-3</div>
<div class="col-xs-12 col-md-3">.col-xs-12 .col-md-3</div>
<div class="col-xs-12 col-md-3">.col-xs-12 .col-md-3</div>
<div class="col-xs-12 col-md-3">.col-xs-12 .col-md-3</div>
</div>

Tell me what will be the output of the following HTML code on mobile and on desktop view?

Bootstrap Interview Question
Bootstrap Interview Question

Answer:

.col-xs-* class defines the number of grids for extra small devices, and .col-md-* defines the number of grids for desktop devices and above. This example will render on the desktop with four columns, and on mobile the columns will have full width and will be stacked on each other.


Previous QuestionNext Question
Do you know what are bootstrap alerts?What is Lead Body Copy in Bootstrap?