title: getcomputedstyle object javascript issue
body: <p>I am having an issue with the getComputedStyle method. I am trying to get the left and top attributes of an element when clicked.</p>
  
  <p>I am able to access the 'left' attribute, but the 'top' attribute returns an object as opposed to a string.</p>
  
  <p>I loop through the array of elements, attaching two event listeners.
  After the click event has fired, when I press the keydown on the target div, I can move from left to right, but up/down does nothing. The style for top returns the window object.</p>
  
  <p>I also have the left and top css declarations defined in the earlier part of the code.</p>
  
  <p>Any help would be greatly appreciated!</p>
  
  <pre><code>Object.keys(source_boxes).forEach(function(key){
  
          source_boxes[key].addEventListener('click',function(){
              clicked = true;
              elem = source_boxes[key];
          });
  
          document.addEventListener('keydown',function(e){
              e.preventDefault();
              if(clicked == true){
                  css = getComputedStyle(elem);
  
                  top =parseInt(css['top']);
                  left =parseInt(css['left']);
  
                  if(e.code ==="ArrowUp"){
                      top = top -5;
                      elem.style.top = top +'px';
                  }else if(e.code ==="ArrowDown"){
                      top = top +5;
                      elem.style.top = top +'px';
                  }else if(e.code ==="ArrowLeft"){
                      left = left -5;
                      elem.style.left = left +'px';
                  }else if(e.code ==="ArrowRight"){
                      left = left +5;
                      elem.style.left = left +'px';
                  }
              }
  
  
  
          });
      });
  </code></pre>