How to vertically align spans with text and image
css, html, vertical-alignment
Solution
Add `vertical-align: middle` to your image.
EDIT
Per comments, this solution also requires display:inline-block;.
Problem
I have now been looking for hours (obviously not in the right place!) Please consider this sample: http://jsfiddle.net/DYLs4/9/ ``` <div id="wrapper"> <span id="text24">Text 24</span> <span id="text12">Text 12</span> <span id="icon"></span> </div> ``` css: ``` #text24{ font-size:24px; color:#999; } #text12{ font-size:12px; color:#000; } #icon{ height:36px; width:36px; display:inline-block; background:url(some-icon.png); } ``` What I'm trying to achieve is this: - Center vertically the text24 (relative to the image) - Align the bottom of text12 with bottom of text24 - Make sure the whole thing work in IE6 -> chrome Many thanks for your help!