<!DOCTYPE html>  <html>     <head>      <title>HTML Calculator</title>              <style>          table {              border: 1px solid black;              margin-left: auto;              margin-right: auto;          }                     input[type="button"] {              width: 100%;              padding: 20px 40px;              background-color: green;              color: white;              font-size: 24px;              font-weight: bold;              border: none;              border-radius: 5px;          }                     input[type="text"] {              padding: 20px 30px;              font-size: 24px;              font-weight: bold;              border: none;              border-radius: 5px;              border: 2px solid black;          }      </style>  </head>     <body>              <table id="calcu">          <tr>              <td colspan="3">                  <input type="text" id="result">              </td>              <td><input type="button" value="c"></td>          </tr>             <tr>              <td><input type="button" value="1"></td>              <td><input type="button" value="2"></td>              <td><input type="button" value="3"></td>              <td><input type="button" value="/"></td>          </tr>          <tr>              <td><input type="button" value="4"></td>              <td><input type="button" value="5"></td>              <td><input type="button" value="6"></td>              <td><input type="button" value="*"></td>          </tr>          <tr>              <td><input type="button" value="7"></td>              <td><input type="button" value="8"></td>              <td><input type="button" value="9"></td>              <td><input type="button" value="-"></td>          </tr>          <tr>              <td><input type="button" value="0"></td>              <td><input type="button" value="."></td>              <td><input type="button" value="="></td>              <td><input type="button" value="+"></td>          </tr>      </table>  </body>     </html>   Output: