开发者

Using fractional em's in CSS's font-size property

Say, I have the following CSS rule defined:

.className {
font-size:0.89em;
}

My question is, how "deep" into fractions can I go while specifying 'em's for browsers actually to support it and for the font size to be rendered differently for a small fractional change in the em开发者_StackOverflow中文版's value?


JohnB is right. We're still rendering in pixels whatever the size unit we use, and small changes in ems will not change the displayed size:

For example, for text originally displaying at a height of 20px*, we can see that there is no effective change when a rule is added to make it .99em of its original height:

20 * 0.99 = 19.8 

The browser can't display .8 of a pixel, so (assuming it will round up) it will still display it as 20px high.

Though it appears that browsers do not always round off as expected:

http://meyerweb.com/eric/thoughts/2010/02/10/rounding-off/

http://ejohn.org/blog/sub-pixel-problems-in-css/

*Yep, I know a font-size of 20px doesn't alway mean it's displayed at 20px!


It should be kept in mind though, that fractional em values, like all floating point numbers, are susceptible to rounding error.

I found that out while setting my media query boundaries, where one max-width was 0.00001em away from another min-width, and it was rounded up and both queries were activated. After changing the difference to 0.001em the queries worked as expected, exclusively.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜