title: How to get complete css of element (classes, inline, @import,@media)
body: <p>I want to work with CSS styles, so I get the needed info about this HTML</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;img src="imagelink" id="IMG" style="margin: 5px 4em 3% 2%;"&gt;
  </code></pre>
  
  <p>by this code</p>
  
  <pre class="lang-js prettyprint-override"><code>if(window.getComputedStyle){
      style = window.getComputedStyle(dom, null);
      for(var i = 0, l = style.length; i &lt; l; i++){
          var prop = style[i];
          var val = style.getPropertyValue(prop);
          returns[prop] = val; 
      }
      return returns;
  }        
  </code></pre>
  
  <p>Until now, I only work with "px", so all works fine.
  Now I try to work with the other units and just I get trouble.</p>
  
  <p>Instead of <code>5px, 4em, 3%, 2%</code>,  I receive from the computedStyle recalculate absolute values for "px".</p>
  
  <pre class="lang-css prettyprint-override"><code>"margin-inline-start": "21.3667px"
  "margin-left": "21.3667px"
  "margin-right": "48px"​
  "margin-top": "5px"
  </code></pre>
  
  <p>Why is it so and how I can prevent that? I want to work with the kind of unit which is defined in the inline CSS.</p>
  
  <p>Recalculate this won't work, because I cannot see any info in the computedStyle that the original kind was not "px".</p>
  
  <p>Thanks a lot for helping to understand and solving that.</p>
  
  <p>UPDATE</p>
  
  <p>I look around to find a way to get all matching rules for a element (css class, inline-style, @import and @media). But all what i find &amp; read are half-workes or to old and wont work now)...i'm frustrated at this point</p>