Hi,

1. we will fix that bug in our documentation, thanks for noticing this.
2. when a device has min-width: 576px there will be three four-column elements but also when the device has min-width: 768px then will appear additional div with width: 100% and display: block that causes a break between second and third element within a row.

Best, Marta

May be misunderstood my question.

1. Why there written '4' (.col .col-sm-4) instead of '3'? Because in the code example its written as '3', but in the visual example it's 4'.

2. Why the column break is not working after second div? It should not keep 3 divs in one row. It should break the column after 2 divs.

Hi,

these blue blocks are documentation examples to show how the grid works. With class .col-example within a div class="col" we overwrite the default padding size. When you put an element inside this div you will have proper padding between elements that are next to each other.

Best, Marta