Aus irgendeinem Grund rendern Firefox und Chrome die Zeilenhöhe bei Verwendung von Text Shadow unterschiedlich.

CSS:

#tracker {
    width:200px;
    color:#999;
    font:normal 12px Verdana,sans-serif;/* Swapped out Arial with Verdana */
}

#tracker ol {
    float: right;
    margin: 0;
    padding: 0;
    white-space: nowrap;
    list-style: none;
}

#tracker li {
    float: left;
    margin: 0 0 0 6px;
    padding: 0;
    height: 13px;
    width: 13px;
    color: #666;
    background-color: #ccc;
    border: 1px solid #c0c0c0;
    border-radius: 9px;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    text-align: center;
    line-height: 13px;
    font-size: 9px;
    text-shadow: 1px 1px 1px #fff;
    overflow: hidden;
}

#tracker li.current {
    color: #fff;
    text-shadow: -1px -1px 1px #033e69;
    font-weight: bold;
    background-color: #13699e;
    border: 1px solid #369;
}
#tracker li span{display:none;}
#step1:before{content:"1"}
#step2:before{content:"2"}
#step3:before{content:"3"}
#step4:before{content:"4"}​

HTML:

<div id="tracker">
    <span class="steps">Steps <span id="current-step">1</span> of 4</span>
    <ol>
        <li id="step1" class="current"><span>Sender</span></li>
        <li id="step2" class="future"><span>Recipient</span></li>
        <li id="step3" class="future"><span>Delivery info</span></li>
        <li id="step4" class="future"><span>Line items</span></li>
    </ol>
</div>

Wenn sich der Textschatten unter dem Text befindet (positive Zahlen), wird der Text nach oben gedrückt.

Sollte der Text nicht derselbe sein, egal wo der Schatten gerendert wird? (wie in FF und IE gezeigt?)

Die einzige Lösung, die ich gefunden habe, besteht darin, die Zeilenhöhe (von 13 auf 15 Pixel) zu erhöhen, wenn der Schatten darunter liegt (mit positiven Zahlen). Bei Nicht-Webkit-Browsern (Firefox und IE) ist dies jedoch ein Problem.

Demo des Problems... Irgendwelche Ideen?

AKTUALISIEREN: Ich habe es herausgefunden und meinen Code aktualisiert. Es war ein Schriftproblem. Ich benutzte Arial, aber als ich es in Verdana änderte, war das Problem gelöst. Sehr eigenartig!

Die Lösung! :)