Question

I have a function to cut string to a exactly width , we called this cut()

cut('abcd',3) = 'abc'

the font-family I use is Arial

but when I calculate each charater’s width , I found whitespace is strange.

<span id='x'> </span>

when I use $("#x").width() I got 0.0

Note that whitespace is not &nbsp

Why ' ' = 0.0 but in 'a b' that ' ' != 0.0

What’s the rule of whitespace in HTML ?

Answer 1

You can use white-space: pre; to force spaces to render as they’re written:

#x {
  white-space: pre;
}

I get a width of 4px: http://jsfiddle.net/qgeUZ/1/