Части таблицы можно оборачивать в отдельные теги tbody (их может быть несколько). Ему можно задать рамку.
При этом стоит иметь ввиду схлопывание границ (свойство border-collapse)
columns-count: 3;
columns-gap: 20px;
для контейнера блоков. сами блоки - inline-block
Плюсы в том, что не нужно рассчитывать количество блоков, как при делении на три столбика и не нужен джаваскрипт, как в случае с масонри
Минус, как всегда, в поддержке браузерами (тут от ТЗ зависит).
используйте при разработке подход называемый "mobile first"
сначала верстайте под мобильные. потом через медиа-запросы подключайте остальное.
например следующий код
@media (min-width: 960px) {
body {
background: url('big-image.jpg');
}
}
будет загружать картинку только при ширине просмотра более 960 пикселей.