Calculator 2 in HTML , CSS , JS

<html>
<head>
<title>Calculator</title>
<script>
function dis(val)
{document.getElementById("result").value+=val}
function solve()
{let x=document.getElementById("result").value
let y=eval(x)
document.getElementById("result").value=y}
function clr()
{document.getElementById("result").value=""}
</script>
<style>
#d1{
position:absolute;
top:25%;
left:25%;
margin:auto;
text-align:center;
background-color:#9DCBEE;
box-shadow: 10px 10px 5px #C8D8DF;}
</style>
</head>
<body style="background:#DDEEFF">
<div align="center" id="d1">
<table>
<tr>
<td colspan="3"><input type="text" id="result" width="100%"/></td>
</tr>
<tr>
<td><input type="button" onclick="clr()" value="C" style="width:100%"/></td>
<td><input type="button" onclick="dis('+')" value="+" style="width:100%"/></td>
<td><input type="button" onclick="solve()" value="=" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" onclick="dis('-')" value="-" style="width:100%"/></td>
<td><input type="button" onclick="dis('*')" value="*" style="width:100%"/></td>
<td><input type="button" onclick="dis('/')" value="/" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" onclick="dis('1')" value="1" style="width:100%"/></td>
<td><input type="button" onclick="dis('2')" value="2" style="width:100%"/></td>
<td><input type="button" onclick="dis('3')" value="3" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" onclick="dis('4')" value="4" style="width:100%"/></td>
<td><input type="button" onclick="dis('5')" value="5" style="width:100%"/></td>
<td><input type="button" onclick="dis('6')" value="6" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" onclick="dis('7')" value="7" style="width:100%"/></td>
<td><input type="button" onclick="dis('8')" value="8" style="width:100%"/></td>
<td><input type="button" onclick="dis('9')" value="9" style="width:100%"/></td>
</tr>
<tr>
<td><br/></td>
<td><input type="button" onclick="dis('0')" value="0" style="width:100%"/></td>
<td><br/></td>
</tr>
</table>
</div>
</body>