JSFiddle - React, Tailwind, and code Playground

HTML

<div class="spacer" ></div>  <input type="button" id="btn1" class="btn" onClick="moveV(-20);" >
    <br/>
<input type="button" id="btn2" class="btn" onClick="moveH(-20);">
    <div class="spacer" ></div>
<input type="button" id="btn4" class="btn" onClick="moveH(20);">
    <br/>
<div class="spacer" ></div> <input type="button" id="btn3" class="btn" onClick="moveV(20);">

<div id="box"></div>

CSS

input{
    position: relative; 
    z-index: 3;
}

.spacer{
    display: inline-block;
    width: 22px;
    min-width: 22px;
}

#box {
    z-index: 2;
    position: absolute; 
    top: 200px; 
    left: 300px;
    width: 100px; 
    height: 227px; 
    border: none;
    background: silver;
}

JavaScript

var viewportwidth;
 var viewportheight;
  
 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
  
 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
 }
  
// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
 
 else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       viewportwidth = document.documentElement.clientWidth,
       viewportheight = document.documentElement.clientHeight
 }
  
 // older versions of IE
  
 else
 {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       viewportheight = document.getElementsByTagName('body')[0].clientHeight
 }


function moveV(i) { 
    var block, vTop, vNum;
    block = document.getElementById('box');
    vTop = block.offsetTop; 
    vNum = parseInt(vTop); 
    vNum += i; 
    if (vNum + block.offsetHeight <= viewportheight && vNum >= 0)
        block.style.top = vNum + "px"; 
} 

function moveH(i) { 
    var block, hLeft, hNum;
    block = document.getElementById('box');
    hLeft = block.offsetLeft; 
    hNum = parseInt(hLeft);         
    hNum += i;     
    if (hNum + block.offsetWidth <= viewportwidth && hNum >= 0)
    block.style.left = hNum + "px";     
}