CSS pour l'étiquette me rend fou

Bonkers! Pourquoi l'élément Label ne s'aligne-t-il pas avec tout?
J'ai mis toutes mes hauteurs de ligne à 24px, blocs en ligne.CSS pour l'étiquette me rend fou

exemple ici: 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>

Source

2010-11-24 FFish

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

ajouté vertical-align:middle à l'étiquette et la durée

Source

2010-11-24 18:04:57

oh mon .. et il semble fonctionner dans tous les navigateurs? Pourquoi l'étiquette fait-elle cela? J'ai essayé de réinitialiser toutes les valeurs par défaut que je pouvais penser. Merci!! – FFish

'span' et' label' se comportent différemment parce que span n'a rien à l'intérieur, alors que label le fait. Comme il n'y a rien à l'intérieur, la hauteur de la ligne n'a aucun effet. mais je suis perplexe quant à la raison pour laquelle l'élément d'étiquette a ces marges. bizarre. –

CSS pour l'étiquette me rend fou

Répondre

Questions connexes