Проблема с размерами

Ни как не могу понять в чем проблема, почему кнопки такие маленькие, вроде бы все указал в CSS

table{
  width: 310px;
  margin: 50px auto;
  background: #663399;;
  border: none;
  border-radius: 10px;
  padding: 0px 20px 20px;
  
}

 .heading{
   color:white;
   font-size: 130%;
   text-align: center;
   

}
#input, #answer{
  width: 260px;
  height: 50px;
  font-size: 210%;
  text-align: right;
  border: none;
}
#input{
  border-radius: 5px 5px 0px 0px;
  box-shadow: 2px 2px 2px black;
  color: #1e1e1e;
}
#answer{
  border-radius:  0px 0px 5px 5px;
  box-shadow: 2px 2px 2px black;
  
}
input [type=button]{
  height: 60px;
  width: 60px; 
  color: blue;
  background: white;
  margin: 1px;
  border-radius: 8px;
  border: none;
}
input[type=button]:hover{
  background: #ccbbcc;
  cursor: pointer;
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" type="text/css" href="css/styles.css">
  <title>Calculator</title>
  
    
</head>

<body>
<table>
  <tr>
   <tr>
    <td class="heading">
      Simple Math Calculator
    </td>
</tr>

<td>
  <input type="text" id="input" placeholder="0" readonly="readonly">
  <input type="text" id="answer" readonly="readonly" style="color:green;">
</td>



  </tr>
<tr>

<td>
<input type = "button" value= "CE" oneclick = "clearScreen()" style="color:white; background: red;">
<input type = "button" value= "&#247" oneclick = "getOperand()">
<input type = "button" value= "x" oneclick = "getOperand('*')">
<input type = "button" value= "&#8592" oneclick = "backspace()" style="color:red;">
<br>
<input type = "button" value= "1" oneclick = "getnumber(1)">
<input type = "button" value= "2" oneclick = "getnumber(2)">
<input type = "button" value= "3" oneclick = "getnumber(3)">
<input type = "button" value= "+" oneclick = "getOperand('+')">
<br>
<input type = "button" value= "4" oneclick = "getnumber(4)">
<input type = "button" value= "5" oneclick = "getnumber(5)">
<input type = "button" value= "6" oneclick = "getnumber(6)">
<input type = "button" value= "-" oneclick = "getOperand('-')">
<br>
<input type = "button" value= "7" oneclick = "getnumber(7)">
<input type = "button" value= "8" oneclick = "getnumber(8)">
<input type = "button" value= "9" oneclick = "getnumber(9)">
<input type = "button" value= "()" oneclick = "brackets()">
<br>
<input type = "button" value= "+/-" oneclick = "getOperand('+/-')">
<input type = "button" value= "0" oneclick = "getnumber(0)">
<input type = "button" value= "**" oneclick = "getOperand('^')">
<input type = "button" value= "=" oneclick = "compter()"style="width: 120px; color:white; background:green;">
<br>
</td>

</tr>




</table>
  


  


  <script type="text/javascript" src="js/scripts.js"></script>
</body>

</html>


Ответы (0 шт):