Additional space under checkbox element [duplicate]

This question already has an answer here:

• Image inside div has extra space below the image 9 answers
• How do I remove the space between inline-block elements? 34 answers

Why is there additional space below checkbox? It is not identified in DevTools but expands its container on about 3-4 pixels. I've tested it in Firefox and Edge browsers, it seems that checkbox has inconsistencies in its visualization (Firefox doesn't change the size of it despite the height: 50px; width: 50px; I use Chrome 67 (on Windows 10). The problem seems the same in Edge. Here is JSFiddle: extra space below checkbox

* {
  box-sizing: border-box;
}

.container {
  border: solid 1px;
  padding: 0;
}

input {
  height: 60px;
  width: 60px;
  margin: 0;
}

<div class="container">
  <input type="checkbox" />
</div>