Uneven spacing between textboxes

Question

I have made a form in html. It's very subtle but I think there is uneven spacing between my text boxes and I'm not sure why:

I believe that the second gap is a couple of pixels wider than the first gap.

I am learning and think it would be instructive for me to figure out why.

The Relevant HTML:

  <span class="span1">
    <span class="date">
      Year:<br><br>
      <input class="textbox1" type="text" name="year" placeholder="yyyy">
    </span>
    <span class="date">
      Month:<br><br>
      <input class="textbox1" type="text" name="month" placeholder="mm">
    </span>
    <span class="date">
      Day:<br><br>
      <input class="textbox1" type="text" name="day" placeholder="dd">
    </span>
  </span>

The Relevant CSS:

.span1{
    display: inline-block;
    margin: 0 auto;
    vertical-align:middle;
    text-align:center;
    position: relative;
    width: 400px;
    padding-top: 63px;
    padding-bottom: 100px;
}

.date{
    display: inline-block;
}

.textbox1 {
    width: 70px;
    height: 30px;
    text-align: center;
}

Answer 1

Try adding float to the date class and then add a margin. Example:

  .date{
      display: inline-block;
      float: left;
      margin-right: 5px;
  }

Plunk Here. Hope it helps!