title: How to return a javascript set style property to CSS default
body: <p>I'm trying to work out how, after changing style properties with javascript, I can revert to the value in the stylesheet (including the units).</p>
  
  <p>In the example below, I'd like the output to read <code>100px</code> (the value in the CSS), rather than <code>10px</code>, as <code>getComputedStyle</code> gives.</p>
  
  <p>I'd also keep the dummy div at <code>top:25px</code>, so removing the <code>style</code> property won't work.</p>
  
  <p>The best I have is cloning the node and reading the height and storing in a property (<a href="http://jsfiddle.net/daneastwell/zHMvh/4/" rel="noreferrer">http://jsfiddle.net/daneastwell/zHMvh/4/</a>), but this is not really getting the browser's default css value (especially if this is set in <code>em</code>s).</p>
  
  <p><a href="http://jsfiddle.net/daneastwell/zHMvh/1/" rel="noreferrer">http://jsfiddle.net/daneastwell/zHMvh/1/</a></p>
  
  <pre><code>&lt;style&gt;
   #elem-container{
     position: absolute;
     left:     100px;
     top:      200px;
     height:   100px;
   }
  &lt;/style&gt;
  
  &lt;div id="elem-container"&gt;dummy&lt;/div&gt;
  &lt;div id="output"&gt;&lt;/div&gt;  
  
  &lt;script&gt;
    function getTheStyle(){
      var elem = document.getElementById("elem-container");
      elem.style.left = "10px";
      elem.style.top = "25px";
      var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue("left");
      document.getElementById("output").innerHTML = theCSSprop;
     }
    getTheStyle();
  &lt;/script&gt;
  </code></pre>