Firefox是唯一支持浮点数作为宽度声明的浏览器吗? (例如163.4px) [英] Is Firefox the only browser that supports floating point numbers as width declaration? (e.g. 163.4px)

问题描述

可能重复:
CSS宽度中的小数位是否得到尊重?

Possible Duplicate:
Are the decimal places in a CSS width respected?

我有一个导航(li)，该导航需要一个像素值以适合ul(具有display:block). 因此，我将width:163.4px用于li.在Firefox(v13.0.1)中确实可以正常工作，但在Safari，Chrome和Opera中，宽度太短. (宽度大约为163px ...所以我想那些浏览器会舍入该值.)

I have a navigation (li) which needs a pixel value to fit within an ul (has display:block). So I use width:163.4px for the li's. This does work fine in Firefox (v13.0.1) but in Safari, Chrome and Opera the width is too short. (The width is there like 163px... So I guess those browsers rounding down the value.)

请解释为什么在这种情况下，只有Firefox才支持浮点数?

Explain me why only Firefox does support floating point numbers for this case?

推荐答案

所有浏览器都舍入小数像素宽度，包括Firefox: http://jsfiddle.net/fgD7H/1/

All browsers round fractional pixel widths, including Firefox: http://jsfiddle.net/fgD7H/1/

您可以在小提琴中看到，红色div的可见宽度每秒仅增加一次，即使实际宽度每秒增加0.1像素十次.这种情况在Chrome和Firefox中都发生过(尚未测试其他产品).

You can see in the fiddle that the visible width of the red div increases only once per second, even though the actual width is incremented by 0.1 pixel ten times per second. This happens both in Chrome and in Firefox (haven't tested others).

我的猜测是两种浏览器的舍入策略存在一些差异(例如，Chrome可能会四舍五入，而Firefox可能会四舍五入).如果您可以在jsfiddle中提供一个演示，也许您的问题可能会更加明显.在所有情况下，渲染的实际宽度都是像素的整数，因此您应该可以通过将宽度设置为163px或164px来解决此问题.

My guess is there is some difference in rounding strategy between the two browsers (e.g. Chrome might be rounding down while Firefox might be rounding up). If you can provide a demo in jsfiddle, perhaps your problem might be more apparent. In all cases, the actual width rendered will be an integer number of pixels, so you should be able to fix the problem by setting your width to either 163px or 164px.

这篇关于Firefox是唯一支持浮点数作为宽度声明的浏览器吗? (例如163.4px)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！