em vs px... for mobile browsers

Question

For desktop browser all modern browser uses Zoom functionality so we can use PX but if same site can be seen on mobile then would px not be good for zooming in mobile browsers. or use of px is also fine for mobile browsers.

even if we don't care for IE 6 , should we use em in place of px still if we are not making different site for mobile, same site will be seen on both desktop and mobile phones (iphone, blackberry, windows mobile, opera mini, android etc?

Answer 1

You can use this trick for converting fonts from px to em in your CSS:

body {
  font-size: 62.5%; /* resets the page font size */
}

Then specify your font sizes like this:

p {
  font-size: 0.8em; /* equals 8px */
  font-size: 1.0em; /* equals 10px */
  font-size: 1.6em; /* equals 16px */
  font-size: 2.0em; /* equals 20px */
}

And so on. Then you can convert px to em for your layout at PXtoEm.com.