Jquery .height() is giving rounded value instead of exact value

1
votes

http://jsfiddle.net/XRXNv/

Exact height is 18.4 px when watching by browser, jquery is giving 18

How to fix this

http://jsfiddle.net/XRXNv/1/

In this second jsfiddle I want to set the viewport height to the sum of first 8 li-s, and there is a little problem...

IE is giving 144, mozilla 172, chrome 160 :)

3
jquery
Think that's just your browser with some zoom settings... Don't think you can even have .4 a pixel? - Raekye
It shows 19 on my browser - firefox, linux. Just so you know. - Lyubomir Vasilev
mozilla shows 19 either when i alert height() in explorer it shows 18 ... - ArmeniaH
chrome yields 20. just sayin' - David Hedlund
What do you mean that the exact height is 18.4, though? You're not setting it anywhere in the fiddle. Is this a ruler to screen thing? - David Hedlund

3 Answers

2
votes

The reason that you receive different heights in different browsers is not pixel rounding issues, it is because the default rendering styles are different between different browsers.

If you want the exact same height across all browsers, style the list to set a height manually. And while you're at it, set it to an integer.

1
votes

You can't set decimal values in pixels:

can an element have a a decimal height in html/css?

If you take a look at the computed style in the javascript console, you'll see that the height is 18px

0
votes

I don't think you are suposed to use decimal numbers. The jQuery transforms the number into and int. And not a double or float. I recommend sticking to whole numbers :)