html - Bootstrap col-xs and col-sm

Question

my bootstrap col-xs working from 768px is that normal , i know the xs is working fro 480px ?

 <li class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
    <p><img src="img/wdigets/1.jpg" class="img-circle" width="66" height="66"></p>
    <p class="name">Johnny Carr</p>
    <p class="big-number">21</p>
</li>

MY DEMO

please check the Inbox Summery box the li make 100% when the size become 768px !!

Answer 1

In fact, you're wrong. Bootstrap 3 col-xs is working from <768px. The grid of bootstrap 3 is:

.col-xs = (<768px)

.col-sm = (≥768px)

.col-md = (≥992px)

.col-lg = (≥1200px)

But.. With bootstrap 4, alpha, they have added a new format to the list, a extra large column. The grid of bootstrap 4 is:

.col-xs = (<544px)

.col-sm = (≥544px)

.col-md = (≥768px)

.col-lg = (≥992px)

.col-xl = (≥1200px)

Hope this hepls you out