Как уменьшить интервалы между блоками и выровнять их по центру?

Tanya, Именно это я и говорил вам выше
"А вообще лучше покажите css для внешнего (родительского контейнера) всех трех карточек" Пожалуйста)

Не отрабатывает функция setInterval(). Почему?

Решено, благодарен вам!

Как организовать грамотное подключение отдельных компонентов Bootstrap 4 (чтобы не подтягивать лишнего)?

illiatovpeko, рады стараться!)

Как организовать грамотное подключение отдельных компонентов Bootstrap 4 (чтобы не подтягивать лишнего)?

Сергей delphinpro, Свое и сердцу ближе, как говорится)

Как организовать грамотное подключение отдельных компонентов Bootstrap 4 (чтобы не подтягивать лишнего)?

Сергей delphinpro, или вы ярый НЕсторонник свежих технологий?

Как организовать грамотное подключение отдельных компонентов Bootstrap 4 (чтобы не подтягивать лишнего)?

Сергей delphinpro, необходимость в инсталляции node.js, пакет npm, директивы и только тогда погнали...
Grid:

.grid {
display: grid;
grid-template-columns: repeat(100, minmax(320px, 1fr));
}

кратчайший путь для достижения сеточно-рядной структуры шаблона + с отзывчивым поведением сразу, чуете разницу? И никаких классов в html ( .container-fluid, .row, col-sm-n, col-xl-n2 ) и тому подобных...
Чувствуется разница не так ли?

Как организовать грамотное подключение отдельных компонентов Bootstrap 4 (чтобы не подтягивать лишнего)?

Сергей delphinpro, Речь идет об исходном состоянии той или иной технологии без допов, а так пилите, я не имею против ничего, сам верстал bootstrap не один десяток проектов. Но все же Grid взял верх!)

Как поделить ячейку?

Если речь идет об html, то используйте вложенные таблицы, если об ms exel - то ПКМ по ячейке - разделить

Как убрать тень под border-bottom?

Mrako_bes, рад быть полезен!

Как убрать тень под border-bottom?

Используйте все параметры box-shadow: x y blur color;

Первые два параметра - управление точкой источника света по двум осям, за счет верных совокупных значений, в том числе и степени размытия ( blur) вы решите свою задачу

Как реализовать display: block по событию onclick одному div и при этом всем раннее открытым из 36 штук - display: none на чистом js?

JRK_DV, у вас есть возможность дать свой вариант? Ни один пока работать не хочет, а корректировку классов сейчас проведу в самом вопросе-изложении (скрытие элементов на практике делаю именно по классам

Как реализовать display: block по событию onclick одному div и при этом всем раннее открытым из 36 штук - display: none на чистом js?

Не совсем понятно каким образом обеспечена связка конкретная кнопка --> конкретный div, ведь ЗАДАЧА: По клику на конкретный элемент меню - присваивать соответствующему div - display: block, тем самым показав его и всё его содержимое, и одновременно с этим закрывать раннее открытый из возможных 36 штук div.

Как реализовать display: block по событию onclick одному div и при этом всем раннее открытым из 36 штук - display: none на чистом js?

JRK_DV, Вы на 100% правы, прошу прощения, окуляры замылились!) Да - "#" вместо "." должна быть как минимум.

Как реализовать display: block по событию onclick одному div и при этом всем раннее открытым из 36 штук - display: none на чистом js?

Я верно понимаю, что мой раннее созданный массив var arrayRanging = [...], а также события onclick вообще не нужны? Интегрировал ваш код, атрибуты data-rating-n - проставил - результата нет к сожалению( Где-то я не допетриваю, видимо

Как реализовать display: block по событию onclick одному div и при этом всем раннее открытым из 36 штук - display: none на чистом js?

Вовсе нет! Посмотрите внимательнее пожалуйста. У каждого из 37 родительских блоков есть содержимое (дочерние элементы) и это содержимое само собой разное по контенту, стили для элементов я реализовал естественно через селектор КЛАССА .ranging - это в коде не отражено, не имеет причастности к вопросу, а скрытие посредством display: none; делается обращаясь к идентиффикаторам каждого div в цикле @for. Генерятся не классы, а айдишники