htmlcsscheckboxhide

HTML / CSS hide checkbox


How can I hide a checkbox using HTML / CSS?

Let's say I have

<table>
  <thead>
    <th>
      Col A
    </th>
    <th>
      Col B
    </th>
  </thead>
  <tbody>
    <tr>
      <td> <input type="checkbox" class="hidden"> Some stuff </td>
    </tr>
    <tr>
      <td> Some Other stuff </td>
    </tr>
  </tbody>
</table>

The name and the values of the checkbox are not constant. I know there's some way with jquery but is there a way to hide it with pure CSS or HTML?


Solution

  • .hidden {
        display: none;
    }
    

    This will hide the checkbox (or any HTML item with the class of "hidden") from display. The checkbox still exists in HTML and can be enabled/disabled with Javascript or by visitors with developer tools.