If I have an element with css style like code
td class="bogus" style="padding-left: 1em;"
, how can I use jquery to get padding-left value as 1em instead of pixels?
$(".bogus").css("padding-left");
This only returns the pixels, but I want it to return what's really in the code, in this case, relative value 1em instead. How ?
Thanks for any guide.
What you can do is to set the base font size (the font-size property on the <body> element) to around 62.8% (some say 62.5%):
<body style="font-size:62.5%;">
This makes the base font, or 1.0em, approximately equal to 10px. It's not exact, and changes from font to font, but generally speaking it's accurate enough. Having done that, you can use EMs and their pixel equivalents:
1.0em = 10px, 1.1em = 11px, 1.2em = 12px etc.
So you can easily convert from pixels to EMs, by dividing by 10:
var ems = parseInt($(".bogus").css("padding-left")) / 10;