text-shadow with em instead of px?

Question

I have a simple

text-shadow: 0.05em 0.05em 0.05em black;

I open in Google Chrome and there is no shadow at all! I change it to

text-shadow: 1px 1px 1px black;

and it works! What is the matter?

Answer 1

0.05em is too small value and your shadow falls behind the text. Try to increase it a little - http://jsfiddle.net/zd4qF/

UPDATE

Your code with .05em will actually work in FF, but not Chrome. That's because of rounding logic in the browsers - FF rounds anything smaller than 1px to 1px, Chrome floors it to 0

Answer 2

If you check the link bellow you can see the conversion rates between em and pixels Since you asked for 0.05em that is way smaller than 1px :)

http://pxtoem.com/

For eg.

1px should be around 0.063em which makes 0.05 em less than 1px thus less than anything you can display.