8 ячеек по 300px в два ряда на флекс в бутсрап. Почему не влазит?

Question

[Тарас Паращук]

Почему 4 ячейки по 300px не влазит в "сontainer" bootstrap ?
Одна переносится даже если сделать 295px.

Но основной вопрос вот: Как с флексбоксами бутстрапа сделать чтобы на
XL было 4 ячейки в два ряда
LG MD 2 ячейки в 4 ряда
SM 1 ячейка восемь рядов

spoiler

.colcol {

width:300px;
height:300px;
border: 1px solid black;

       }

<div class="container">
<div class="row d-flex flex-row justify-content-center" >

       <div class="colcol"></div> 
       <div class="colcol"></div> 
                 
       <div class="colcol"></div> 
       <div class="colcol"></div> 
              
       <div class="colcol"></div> 
       <div class="colcol"></div> 
                 
        <div class="colcol"></div> 
       <div class="colcol"></div> 
        
       </div>
</div>

Answer 1

[Иван Фронтендов]

Потому что 1200 больше чем 1140.
https://getbootstrap.com/docs/4.0/layout/grid/#gri...