Colspan not working with input field in html

I've been trying to make a basic form inside a table to keep all the input fields intact but I want to have some gap between the columns and that's why I tried inserting colspan but it's not working at all, When I try to do the same with the label it works but for some reason not with input field. Can anyone please help me with this?

  <form>
    <table>
      <tr>
        <td>
          <label for = "first">First Name</label>
        </td>
        <td colspan="4">
          <input type = "text" id = "first">
        </td>
        <td>
          <label for = "last">Last Name</label>
        </td>
        <td>
          <input type = "text" id = "last">
        </td>
        <td>
          <button type="submit">Submit!</button>
        </td>
      </tr>
    </table>
  </form>