CODEWITHSUNDEEP
csslabel
TunaFFish
TunaFFish

Reputation: 11302

CSS for label drives me crazy

Bonkers!

Why does the Label element not align up with everything?
I set all my line-heights to 24px, inline-blocks.

example here: 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>

Upvotes: 1

Views: 194

Answers (1)

Sebastian Patane Masuelli
Sebastian Patane Masuelli

Reputation: 4247

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

added vertical-align:middle to the label and span

Upvotes: 2

Related Questions