Ik heb een stukje code waarvan ik graag de plus.png image constant in het midden wil, margin top werkt niet goed voor mijn situatie aangezien de afmeting van de box constant anders is. Kan iemand mij laten zien hoe ik de image plus.png verticaal in het midden kan zetten?

{foreach from=$products.$k item=product}
<li class="product">
<a href="#" onclick="add({$product.Menu_productID})">
<strong>{$product.name|ucfirst}</strong>
<em>{$product.extra}</em>
<span>&euro; {$product.price|number_format:2:",":"."}<img style="margin-left: 10px; margin-bottom: -14px;" src="{$img}/plus.png"></span>
</a>
</li>
{/foreach}

vertical-align: middle;

Origineel gepost door Patrick Groot

vertical-align: middle;

Dat is natuurlijk niet het antwoord.

Hier: http://www.vanseodesign.com/css/vertical-centering/

Je kunt de afbeelding ook als background gebruiken en dan "background-position: center center;" gebruiken.
Maar in Luuks post staan ook legio voorbeelden.

Origineel gepost door Luuk Olde Bijvank

Dat is natuurlijk niet het antwoord.

Hier: http://www.vanseodesign.com/css/vertical-centering/

Dat is niet het antwoord? Is exact het zelfde antwoord als wat jij geeft?

Aan jou antwoord heeft hij ook niks want die plus staat in een row-element.

Wat hij dus zou kunnen proberen is die span een hoogte te geven van 61px met line-height:61px;

En dit toevoegen aan Img vertical-align:middle;

Daarbij moet hij nog steeds meer HTML en of CSS veranderen voor dat resultaat.