В размере lg все как надо, по 3 колонки на строку
![65443499d4c62256797708.jpeg](https://habrastorage.org/webt/65/44/34/65443499d4c62256797708.jpeg)
В md тоже как надо, по одной колонке на строку
![654434a11165f980120604.jpeg](https://habrastorage.org/webt/65/44/34/654434a11165f980120604.jpeg)
Но вот когда уменьшаю размер экрана в sm, он опять становится в 3 колонки на строку
![654434a80fbf1470276945.jpeg](https://habrastorage.org/webt/65/44/34/654434a80fbf1470276945.jpeg)
Как сделать, чтобы на экранах lg были в 3 колонки, а если меньше экран, то на всю строку одна колонка?
Сейчас код такой:
<div class="row row-cols-3">
<div class="col-md-12 col-lg-4">video</div>
<div class="col-md-12 col-lg-4">video</div>
<div class="col-md-12 col-lg-4">video</div>
<div class="col-md-12 col-lg-4">video</div>
<div class="col-md-12 col-lg-4">video</div>
<div class="col-md-12 col-lg-4">video</div>
</div>
Пробовал md заменить на sm, теперь на sm экранах норм тоже, а вот на экстра маленьких опять в 3 колонки становится