different width of same text across browsers

问题

The width of text is rendered differently across Chrome(/safari), FF and IE. There is a quite big difference between Chrome and FF, while only small gaps between FF and IE. You can see the difference by opening this in browsers: http://jsfiddle.net/xhx9z/

Does anybody know if there is any way to reduce the gap so that the width are close across browsers.

Simple test:

<span>this is a test of text width and see the difference across browsers<span>

$(document).ready(function() {
    alert($('span').width());
});

The results of width are:

chrome/safari: 501
FF: 519
IE: 520

回答1:

If you need these elements to be a certain size, don't let the browser compute it: force what you need it to be using CSS.

回答2:

Rendering text depend from Operating system settings, used browser. And always will be different. Try another way to solve the preceding problem.

来源：https://stackoverflow.com/questions/22530190/different-width-of-same-text-across-browsers