Serr.biz Web Design - Internet Marketing - Web Templates

Category browse page images not aligning

Question: In Virtumart 1.1.2 the product images on the category browse pages look bad.  There are 3 images in a row on one line, but then next line has 1 image, then 3, then one.  It looks terrible. 

Answer: Virtuemart 1.0 and 1.1 both allow you to set how many images are shown in a row for the category browse pages.  In both you just have to choose how many you want to show.  I suspect what is happening on your site is the setting has a value of 4 and thumbnail image widths combined are too wide for that div. 

It's like this. 

The container of that space is 300.  You have 4 images that are 100 pixels wide each.  Combined, they need at least 400 pixels.  The system is trying to force 400 pixels into a 300 pixel box (div).  The div likely has a fixed width and so, 4th image "wraps" to the next line.  So, that is why you have a 3, 1 ,3, 1 layout.

To fix, just go to components > virtuemart > category and edit the category in question.  Set the value to 3 vs 4, or less.

Or, you could try making your thumbnails smaller.

Another option to modify your templates and or the "browse" page template to accommodate the needed width.