Warenkorb Icon durch .png Grafik austauschen

Hallo,

ich würde gerne das Warenkorb Icon durch eine Grafik austauschen.

Leider verrutscht die Grafik, wenn ich das

<i>

 Element gegen ein

<img>

Element austausche.

Anbei ein Screenshot:

Hat das schon jemand so umgesetzt?

{* Cart entry *}
{block name="frontend_index_checkout_actions_cart"}
	<li class="navigation--entry entry--cart" role="menuitem">
		<a class="btn is--icon-left cart--link" href="{url controller='checkout' action='cart'}" title="{"{s namespace='frontend/index/checkout_actions' name='IndexLinkCart'}{/s}"|escape}">
			<span class="cart--display">
				{if $sUserLoggedIn}
					{s name='IndexLinkCheckout' namespace='frontend/index/checkout_actions'}{/s}
				{else}
					{s namespace='frontend/index/checkout_actions' name='IndexLinkCart'}{/s}
				{/if}
			</span>

            <span style="width:100px;" class="badge is--primary is--minimal cart--quantity{if $sBasketQuantity < 1} is--hidden{/if}">{$sBasketQuantity}</span>

            <img src="../../themes/Frontend/Test/frontend/_public/src/img/basket.png" border="0" style="float:left;" />

			<span class="cart--amount">
				{$sBasketAmount|currency} {s name="Star" namespace="frontend/listing/box_article"}{/s}
			</span>
		</a>
		<div class="ajax-loader"> </div>
	</li>
{/block}

PS: Anbei nochmal mein aktueller Code:

Vielen Dank

Flo