Additional Product Images in single row (image inside)

Hi,

Using the default Opencart template 1.5.6.1 and having trouble with the alignment of additional product images.

The default template aligns additional images in rows of two which looks ugly when wanting to add more than two images. I would like to be able to put the images on a single row, wrapping if necessary at the edge of the page to a second row ... and so on.

This should show more clearly what I want to achieve:



I would also like to know how to get rid of the highlighted cross sections where the lines overlap if anyone can point me in the right direction?

I have searched this topic and have drawn a blank, there is one thread which includes adding a table and although this works to an extent, with a large number of images they just run off the page without wrapping so not the ideal solution.

Any help will be greatly appreciated.

Thanks

You need to make some adjustments in your stylesheet.css file to make the div for the additional images wider and add some padding to the sections that are overlapping.

Thanks, not quite what I was after as this keeps the imaged in a table and throws out the alignment of the product info and cart options. Your info let me in the right direction though.

For anyone interested, I moved the <div class="image-additional"> within the same file outside the table and just before the tabs div.

Worked well