Untitled

<!DOCTYPE html>
<html>
	<head>
		<title>Calculator</title>
		<script>

function checkSize() {
	var html = document.documentElement;
	var divC = document.getElementById("interface");

	// Calculate horizontal spacing.
	var divCX = Math.floor((html.clientWidth - divC.offsetWidth) / 2);

	// Calculate vertical spacing.
	var divCY = Math.floor((html.clientHeight - divC.offsetHeight) / 2);

	// Assign positions to the two div elements.
	divC.style.top = divCY + "px";
	divC.style.left = divCX + "px";
}

function btnPress(nmbrEl) {
	var display = document.getElementById("textDisplay");
	display.innerText += nmbrEl.innerText;
}

		</script>
		<style>

div#interface {
	position: absolute;
	margin: 0px;
	background-color: #6666ee;
}

div#interfaceBody {
	margin: 0px;
	padding: 0px;
	background-color: transparent;
}

button.nmbr {
	height: 100px;
	width: 100px;
	font-size: x-large;
}

table, tbody, tr {
	border-collapse: collapse;
	background-color: transparent;
}

td {
	width: 25%;
	padding: 5px;
}

td.ifacedisplay {
	text-align: center;
	margin: auto;
}

td.ifacedisplay div {
	background-color: #deedee;
	border: 1px solid #000000;
	margin: auto;
	font-size: xx-large;
	text-align: right;
	padding-left: 10px;
	padding-right: 10px;
}

		</style>
	</head>
	<body onload="checkSize()">
		<div id="interface">
			<div style="interfaceBody">
				<table>
					<tbody>
						<tr>
							<td class="ifacedisplay" colspan="5"><div id="textDisplay">0</div></td>
						</tr>
						<tr>
							<td><button class="nmbr" onclick="btnPress(this)">7</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">8</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">9</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">/</button></td>
						</tr>
						<tr>
							<td><button class="nmbr" onclick="btnPress(this)">4</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">5</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">6</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">*</button></td>
						</tr>
						<tr>
							<td><button class="nmbr" onclick="btnPress(this)">1</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">2</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">3</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">-</button></td>
						</tr>
						<tr>
							<td><button class="nmbr" onclick="btnPress(this)">0</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">.</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">C</button></td>
							<td><button class="nmbr" onclick="btnPress(this)">+</button></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</body>
</html>