Ich habe ein seltsames Problem bei der Arbeit mit HTML und CSS in verschiedenen Browsern: Firefox 3.6 und Webkit-Browser (Chrome und Safari).
Mein HTML sieht folgendermaßen aus:
<div class="ln-letters">
<a href="#" class="all">ALL</a>
<a href="#" class="a">A</a>
<a href="#" class="b">B</a>
<a href="#" class="c">C</a>
</div>Und mein CSS ist...
.ln-letters a {
font-family: 'Lucida Grande';
font-size:14px;
display:block;
float:left;
padding:0px 7px;
border-left:1px solid silver;
border-right:none;
text-decoration:none;
}Wie Sie sich denken können, erhält jeder Anker je nach seinem inneren Text eine andere Breite. Zum Beispiel wird das erste Element mit dem Text "ALL" größer (breiter) sein als die anderen.
Nun ist das Problem, dass in Firefox (mit Firebug) kann ich sehen, dass die berechnete Breite für das erste Element 26.5667px ist, während in Chrome (mit Chrome-Entwickler-Tools) die berechnete Breite für das gleiche Element ist genau 27px.
Daher endet das div.ln-letters in jedem Browser mit unterschiedlichen Breiten, was mir einige Probleme bereitet.
Die Frage ist: Gibt es einen Workaround, um zu verhindern, dass Firefox Dezimalwerte berechnet? Oder das Gegenteil: Chrome dazu zwingen, Dezimalwerte zu berechnen?
Vielen Dank im Voraus!
