how to center dynamic mopics in product info page

[MrE03]

which files are needed to edit in order for me to make the dynamic mopics' images centered, also i tried adding spaces but nothing changed and the images are still kind of too close to each other

[pgmarshall]

		//// BEGIN:  Added for Dynamic MoPics v3.000
?>
      <tr>
      	<td>
				<div class="screenshotsHeader">
					<div class="screenshotsHeaderText"><?php echo TEXT_OTHER_PRODUCT_IMAGES; ?></div>
				</div>
				<div class="screenshotsBlock">
					<?php include(DIR_WS_MODULES . 'dynamic_mopics.php'); ?>
   			        </div>
	</td>
      </tr>
<?php
		//// END:  Added for Dynamic MoPics v3.000

Is the bit you need to edit - try putting a <td align="center"> in.

If you want to change the layout of the contents of the mopics then you will need to open catalog/includes/modules/dynamic_mopics.php

[ridexbuilder]

Also utilised in the 'Enhanced' mod - see the CSS file

[MrE03]

cool thanks again for your assistance i will try this and let you know if i succeed, your continuous efforts with my cry for help never ceases to amaze me

update: well it seems to move it around, but it doesnt quite center it, im guessing maybe i do have to edit the css around a bit to make it centered

[ridexbuilder]

"The Boss" helped with cross-browser compatibility, if I recall correctly.

[MrE03]

you might have missed my update on the thread edit, but i didnt manage to get it centered exactly :\

[ridexbuilder]

Sorry, missed the update. Did you have a look at the Enh. Mopics Code?

http://dev.ejsolutions.co.uk/oscmax/...&products_id=2

[ridexbuilder]

This might help - sorry quick 'n' dirty 'cos busy on other 'stuff'.

<div class="screenshotsBlock"><div align="center">
<div class="screenshots">
</div>

<div class="screenshots">
<script language="javascript">
</script>

<a title="Sweatshirt" rel="lightbox[group]" target="_blank" href="http://dev.ejsolutions.co.uk/oscmax/catalog/images/images_big/sweat_2.png">
<img width="100" height="97" border="0" title=" Sweatshirt " alt="Sweatshirt" src="images/thumbs/sweat_2.png"/>

<br/>

<span class="smallText">Click to enlarge</span>


</a>

<noscript> <a href="http://dev.ejsolutions.co.uk/oscmax/catalog/images/images_big/sweat_2.png" target="_blank"><img src="images/thumbs/sweat_2.png" border="0" alt="Sweatshirt" title=" Sweatshirt " width="100" height="97"><br /><span class="smallText">Click to enlarge</span></a> </noscript>


</div>

<div class="screenshots">
</div>

<div class="clearScreenshots">
</div>


</div>

.screenshotsBlock {
text-align:center;


}
.screenshots {
display:inline-block;
margin-left:auto;
margin-right:auto;
padding:5px 0;
text-align:center;
vertical-align:top;


}