X-Cart forums - View Single Post

ITVV · #26 11-18-2017, 08:55 AM

Hi again,

I am using a different skin which is using all sorts of different includes / CSS.

However, here is a very basic version of what I use for Credit Card Logos. Perhaps try this in your skin/common_files/customer/right_bar.tpl and adjust via CSS?

{*right_bar.tpl*}

Code:

<div class="payment_logos_new">
<ul><li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/paypal.png" alt"PayPal">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/amex.png" alt="Amex">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/mastercard.png" alt="MasterCard">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/maestro2.png" alt="Maestro">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/switch2.png" alt="Switch">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/visa.png" alt="Visa">&nbsp;</li>
	<li><img class="lazy" src="{$ImagesDir}/spacer.gif" width="48" height="30" data-src="{$AltImagesDir}/payment/visae.png" alt="Electron"></li>
</ul>
</div>

CSS

Code:

/* NEW PAYMENT LOGOS HEADER
-------------------------------*/
div.payment_logos_new ul { text-align: center; margin: 0; margin-top: 0px; margin-bottom: -10px; padding: 0; }
div.payment_logos_new ul li { display: inline-block; padding-right: 0px; padding-top: 6px; }
div.payment_logos_new ul li span { white-space: nowrap; text-indent: 9999em; overflow: hidden; }
div.payment_logos_new ul li img { min-width: 48px; min-height: 30px; border-radius: 0px; }

Hope it helps a little?

Kind regards

ITVV