Сергей Борисов, а, да, не при каждом шаге, но пару раз проскальзывало.
Ну, скорее всего, это происходит из-за того, что идёт не попадание в браузерную пиксельную сетку.
Без гарантий что это поможет, но у меня пока только одно предложение - перерисовать с недробными значениями в координатах и чтобы значения были кратны 4м.
но чтобы эти блоки переносились друг под друга в случае например достижения определнной ширины
Ну так и в чём вопрос?
Как работает flex-wrap? Переносит элементы, когда они перестают помещаться в строку.
Когда все блоки резиновые, что нужно сделать чтобы они перестали помещаться?
Задать ограничения на минимальную ширину.
Ну то есть Вы хотите вместо if какую то другую строчку?
В чём тогда будет разница?
Если есть исключение и его нужно как-то обработать, то в любом случае нужно написать для этого какой-то код, верно?
dualdeazz, Не так то, что Вы даже сейчас, судя по всему, не прочли правила.
Прочитайте, в частности раздел 3, сравните со своим вопросом и сделайте вывод что не так.
Например,
вот https://png2svg.com/
и вот https://www.freeconvert.com/png-to-svg/download (тут даже настройки есть)