X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)
-   -   How to center product thumbnails (https://forum.x-cart.com/showthread.php?t=52579)

MikeBrum 02-28-2010 09:20 PM

How to center product thumbnails
 
Ok, maybe because it's late and I'm ridiculously tired, but I've tried so many things and cannot get this to work.

How do I get the product thumbnails to be centered in the table cells? Here is what that portion my /customer/main/products_t.tpl looks like:

(page link: http://67.20.92.91/store/Hand-shaped-Bodyboards/ )

-----------begin code------------

<tr{interline name=products_matrix}>

{foreach from=$row item=product name=products}
{if $product}

<td{interline name=products additional_class="product-cell"} style="padding-top:5px; padding-bottom:5px;">
<div class="image">
<div class="image-border"{if $config.Appearance.image_width gt 0 || $product.tmbn_x gt 0} style="width: {math equation="x+14" x=$product.tmbn_x|default:$config.Appearance.image _width}px;"{/if}>
<a href="{$product.alt_url|default:$product.page_url| amp}">{include file="product_thumbnail.tpl" productid=$product.productid image_x=$product.tmbn_x image_y=$product.tmbn_y product=$product.product tmbn_url=$product.tmbn_url}</a>

{if $active_modules.Special_Offers && $product.have_offers}
{include file="modules/Special_Offers/customer/product_offer_thumb.tpl"}
{/if}
</div>
</div>
</td>

{/if}
{/foreach}

</tr>

-----------end code------------

pauldodman 03-01-2010 02:00 AM

Re: How to center product thumbnails
 
Yes, I can see you've had a good go at this - you've got align center in every single possible div/table cell.
In which case, most likely is that somewhere an align left is overwriting it.
Try changing this one:

dialog .content {
color:#CCCC99;
text-align:left;


}

MikeBrum 03-01-2010 07:15 AM

Re: How to center product thumbnails
 
Thanks for the response. I tried changing that in in main.css and altskin.css but it had no effect.

In ALTSKIN.css, I tried adding...

product-cell .image {text-align:center;


}


but that didn't work either. I also tried editing these lines within MAIN.css

}
tr.highlight td,
tr.highlight th
{
background: #3b2e22 none;
text-align:center;
}

tr.center-row th {
text-align: center;
}


but that didn't work either.

Here is what Web-Developer is showing me.

http://www.synapdev.com/downloads/help.jpg

MikeBrum 03-01-2010 07:03 PM

Re: How to center product thumbnails
 
I tried some more things this evening, but they also did not work.

Any ideas? I'm missing something simple and it's driving me insane.

gb2world 03-01-2010 07:59 PM

Re: How to center product thumbnails
 
In firebug - I added
margin: 0px auto;
to
.products .image .image-border in altskin.css
and they centered

MikeBrum 03-01-2010 08:13 PM

Re: How to center product thumbnails
 
Thanks gb2world! That worked.

Much appreciated.


All times are GMT -8. The time now is 04:29 PM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.