I'm designing responsive website for our product. I want to know for which CSS definitions I should use em instead of px. What are the possible future problems i have to face if I use em throughout my css.
Following are the css definitions in question :
width
padding
border-radius
border
height
margin
line-height
font-size
box-shadow
text-shadow
I'm using em for font size and line-height properties. Am I suppose to use em for other properties too? Will it cause zooming issues in different DPI modes on various mobile and tablet devices? Are there any CSS properties for which I must use em (or px) specifically to avoid future troubles in responsive designing?
Thank you.
P.S. I understand this question can't be answered straight forward. I'm expecting expert's opinions on zooming issues in different DPI modes and css standards to follow in responsive designing.