Динамическое изменение количества товаров в строке [альтернативное решение] - [VM1] Дизайн, оформление

В настройках магазина можно выставить количество отображения товаров в строке, а как быть если у вас резиновый сайт, и при уменьшении размеров окна браузера, товары съезжают друг на друга?! Задача ставилась, чтоб лишние позиции переносились на следующую строку.

Перерыв кучу сайтов решения так и не нашел, советы по использованию выравнивания блоков float:left оказались не эффективными, поэтому я решил подогнать товары под минимальную ширину контента 1024px, а при просмотре на широких мониторах товары растягивались по всей ширине.

Для отображения в категории я выбрал шаблон browse_3.php (\components\com_virtuemart\themes\default\templates\browse) и отредактировал под свои нужды:
т.е. сначала идет изображение 180х180px (при клике открывается большая картинка в лайтбоксе), далее название товара, далее краткое описание высотой 70px (высоту можно задать любую), и последняя строчка цены с кнопкой "Заказать".
Все это выстраивается в строки по 5 позиций, каждая по 19% шириной. На моем сайте нет боковых модулей и основное содежимое имеет отступы от краев по 20px, поэтому если у вас есть правые или левые модули, то  вам необходимо изменить количество отображения товаров в настройках магазина и изменить ширину ячейки соответственно количеству (4 товара - 24%, 3 товара 29% и т.д.). От карточек товаров решили отказаться (скрыл подробнее), так же как и от поля выбора количества. Еще один важный момент - я использую безтабличную верстку, в настройках магазина во вкладке "сайт", кнопка "настройки" нужно выбрать Product list (no-table, div-based) и отредактировать отвечающий за это файл browse_notables.tpl.php (\components\com_virtuemart\themes\default\templates\browse\includes)
в 33 строке
меняем ширину ячейки как описано выше

В итоге получился результат близкий к желаемому. (ссылку добавлю позже)

1024

1600