title: jQuery .css() function not returning expected values
body: <p>Alright, I've search the jQuery docs (needs somebody devoted to maintaining), I've searched SO, and I've searched Google.  I can't find the answer to this question.</p>
  
  <hr>
  
  <h2>In Words</h2>
  
  <p>In the past, I remember jQuery working like this:</p>
  
  <p><code>$('#myObj').width()</code> returns the computed width of <code>#myObj</code>.<br>
  <code>$('#myObj').css('width')</code> returns the width as it is entered into the CSS stylesheet.</p>
  
  <p>Now, any jQuery package I use returns the exact same number no matter which method I use.</p>
  
  <p><code>$('#myObj').width()</code> returns the computed width of <code>#myObj</code> as an integer (float?).<br>
  <code>$('#myObj').css('width')</code> returns the computed width of <code>#myObj</code> as a string with <code>px</code> on the end.</p>
  
  <hr>
  
  <h2>In Pseudocode</h2>
  
  <pre><code>#myobject{
      width: 14em;
      height: 14em;
  }
  
  &lt;div id="myobject"&gt;Has Text&lt;/div&gt;
  
  &lt;script type="text/javascript"&gt;
      $( '#myobject' ).click(function(){
          alert($(this).css('width') + "\n" + $(this).width());
      });
  &lt;/script&gt;
  
  //Always alerts "224px [newline] 224"
  //Expected to alert "14em [newline] 224"
  </code></pre>
  
  <hr>
  
  <p>These pixel-based return values are almost completely useless, as I need to do calculations based on what's actually in the CSS.  For example, I want to do math on the <code>left</code> position of an element, but I can't because it keeps returning pixel values, which are worthless in an <code>em</code>-based design.</p>
  
  <p>Is there any way to get the actual values out of the CSS in jQuery?<br>
  Is this a jQuery bug, or am I missing something?</p>
  
  <p>Here's a jsfiddle: <a href="http://jsfiddle.net/yAnFL/1/" rel="nofollow">http://jsfiddle.net/yAnFL/1/</a>.</p>
  
  <hr>
  
  <h2>Resolution</h2>
  
  <p>Apparently, this is the intended result.<br>
  I have decided to use <a href="http://www.filamentgroup.com/lab/update_jquery_plugin_for_retaining_scalable_interfaces_with_pixel_to_em_con/" rel="nofollow">this plugin</a> to do conversions for me.<br>
  Taking away control of CSS seems like a poor choice in the jQuery design.</p>