CSS für Etikett treibt mich verrückt

Question

Bonkers!

Warum stimmt das Label-Element nicht mit allem überein?
Ich setze alle meine Zeilenhöhen auf 24px, Inline-Blöcke. hier

Beispiel: http://jsfiddle.net/kMtYN/

html { 
    font-size: 16px; 
    font-family:'Lucida Grande', 'Trebuchet MS'; 
} 
.ims-div { 
    height: 24px; 
    background: gray; 
} 
.ims-span { 
    display: inline-block; 
    width: 24px; height: 24px; 
    background: green url('is-check-small-sprite-blue.png') 0 -72px no-repeat; 
} 
.ims-label { 
    display: inline-block; 
    line-height: 24px; 
    margin: 0; padding: 0; border: 0; 
    background: purple; 
    color: white; 
    font-weight: normal; 
} 

<div class="ims-div"> 
    <span class="ims-span"></span> 
    <label class="ims-label">CheckBox 1</label> 
</div> 

Answer 1

http://jsfiddle.net/SebastianPataneMasuelli/kMtYN/1/

hinzugefügt vertical-align:middle auf das Etikett und Spanne