All of the text remains aligned to the left, despite my attempts to position it at the top.
I feel like I haven't even completed 1% of the task and I'm faced with countless issues.
Although I've coded it so that every click should increment by 1, it's still stuck at 0 every time you click.
This is the code snippet:
<title>CPS Tester</title>
<script type="text/javascript">
let clicks = int(0)
elem = document.getElementById("numClicks").innerHTML
= var clicks
</script>
<style>
@font-face{
font-family: font;
src:url('assets/font.ttf') format('truetype')
}
div.clickhere{
text-align: left;
position: top;
z-index: 0;
}
div.stats {
text-align: right;
font-family: "font";
position: top;
z-index: 1;
background-position-y: 0;
}
</style>
<div class="clickhere">
<img src="assets/button1.png" onclick="click();">
</div>
<div class="stats">
<button onclick="start()">Start</button>
<p>You have clicked <span id=numClicks>0</span> times.</p>
</div>
<script type="text/javascript">
var click = int(0);
clickhere.onclick=click(){click ++;}
function start {
let clicks = int(0)
document.getElementById("numClicks").innerHTML
= var clicks
}
function click() {
var clicks = var clicks + int(1)
document.getElementById("numClicks").innerHTML
= var clicks
}
function calculatecps(inclicks, seconds) {
var cps = inclicks / seconds
return cps
}
</script>
This CSS issue has me frustrated, as it's set to top but appears at the bottom