Untitled

<!DOCTYPE html>

<head>
<script src="gamepad.js"></script>
<script src="tester.js"></script>


<title>Hitbox input viewer!</title>
<style>
#gamepads {
    background-color: blue;
    }

#gamepads div {
    position: absolute;
    height: 96px;
    width: 100px;
    /* border: 1px solid white; */
    background-image:url("button_neutral.png");
    color: white;
    line-height:100px;
    text-align:center;

    }


#left { top:66px; left:13px; }
#down { top:66px; left:116px; }
#right { top:114px; left:213px; }
#up { top:274px; left:262px;
    width:150px
    height:150px;}


#lp { top:63px; left:320px; }
#mp { top:16px; left:420px; }
#hp { top:16px; left:531px; }

#lk { top:171px; left:320px; }
#mk { top:130px; left:420px; }
#hk { top:130px; left:531px; }


.pressed { background-image:url("button_pressed.png") !important;
color: black !important; }
</style>
</head>


<body>

<div style="width:650px;height:375px;border:solid 1px black" id="gamepads">
<div class="" id="left" name="left">left</div>
<div class="" id="down" name="down">down</div>
<div class="" id="right" name="right">right</div>
<div class="" id="up" name="up">up</div>


<div class="" id="lp" name="lp">lp</div>
<div class="" id="mp" name="mp">mp</div>
<div class="" id="hp" name="hp">hp</div>

<div class="" id="lk" name="lk">lk</div>
<div class="" id="mk" name="mk">mk</div>
<div class="" id="hk" name="hk">hk</div>
</div>


</body>
</html>