Hello one more time!
I have a strange problem working with HTML,CSS in different browsers:
Firefox 3.6 and Webkit browsers (Chrome & Safari).
My HTML looks like this:
<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>
And my CSS is...
.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;
}
So as you can guess, each anchor gets a different width depending on its inner text. For example the first element with the text 'ALL' will be bigger (more width) than the others.
Now the problem is that in
Firefox (using Firebug) I can see that the computed width for the first element is 26.5667px, while in Chrome (using Chrome's developer tools) the computed width for the same element is exactly 27px.
Therefore the div.ln-letters ends with different widths in each browser and that is causing me some troubles.
Question is: there is any workaround to avoid
Firefox computing decimal values? Or the opposite: to force Chrome to compute decimal values?
Thank you in advance!
