I managed to do this before but i cant find the code i used and its now gone back to the way it was before... I have the main pic on top of 4 thumbnails. When there are only 3 thumbnails uploaded for a product, the thumbnails are not aligning to the left like they used to. It'll only look proper when there's 4 thumbnails there...
Here's the page (i'll need to remove this in a few hours coz i cant risk search engines indexing this page!):
http://www.cashandcarrykitchens.ie/CMSt ... ch-bedroom
The code used for the table layout is:
Code: Select all
<div class="item" align="left">
<table width="100%">
<tr><td width="258"><h2>{$title}</h2></td><td colspan="4"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" align="left"><span style="color:#567784;font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 10px;">Previous: {cms_selflink dir="previous" lang="0" class="relation"}</span></td>
<td width="50%" align="right"><span style="color:#567784;font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 10px;">Next: {cms_selflink dir="next" lang="0" class="relation"}</span></td>
</tr>
</table></td>
</tr><td>
<tr>
<td width="258" valign="top">
{section name=at loop=$attrlist}
<h3>{$attrlist[at].name}:</h3><h5>{eval var=$attrlist[at].key}</h5><br>
{/section}
{literal}
<__script__ type="text/javascript">
function repl(img)
{
document.item_image.src=img;
}
</__script>
{/literal}<br>
<br>
<br>
<br></td>
<td align="left" colspan="4"><img name="item_image" id="item_image" src="{$image_1_url}" /></td>
</tr>
<td width="258" valign="bottom"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" width="8" valign="middle"><img src="modules/Printing/printbutton.gif"></td>
<td align="left" valign="middle"><span style="color:#567784;font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 10px;">{print goback="false" popup="true" script="true" text="Print this page" class="noprint"}</span></td>
</tr>
</table></td>
<td align="left" width="130">{section name=ind loop=$image_url_array}<a href="javascript:repl('{$image_url_array[ind]}')"><img src="{$image_thumb_url_array[ind]}" /></a></td>
<td align="left">{/section}</td>
</tr>
</table>
</div>