Добрый день.

Подскажите пожалуйста направление для поиска решения следующей задачи:
на странице условно есть сетка NxN, размер каждой ячейки 100px-100px, есть группа
изображений каждая сторона кратна 100рх, но не может быть больше 300рх, количество изображений может быть большое.
формат изображений может быть 1х1, 1x2, 1x3, 2x1, 3x1, 2x2

Нужно расположить эти изображения на странице, чтобы они заполняли условную сетку максимально без пробелов между собой.
Я пока думаю над темой алгоритма рюкзака, но пока не очень получается. Если если какие то свойства в CSS, которые позволят добиться нужного эффекта или скрипты JS готовые, подскажите пожалуйста.
Пример расположения изображений на странице в приложенном файле