CSS/HTML - Input boxes are not aligned by a few pixels for a form

Issue

I've been stuck on this issue for a few hours now and tried everything I could think of.

Essentially, I have a form that takes an email address and a token in two separate input boxes/fields, I have centred the entire form and put the two boxes on separate lines however when I look closely (and measure), the two textboxes for the user to type into, are misaligned by 8 pixels and it's driving my OCD nuts. Here is the code that I have for the form.

<form id = "order" method = "POST" action ="/orderemail">
      <label class="text-info" for="email" style="font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-weight: bolder; font-size: x-large;">Email:</label>
      <input style="text-align:center; font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-weight: bolder; font-size: x-large;" type="email" id="email" name="email" placeholder="Enter your email" required><br><br>

      <label class="text-info" for="email" style="font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-weight: bolder; font-size: x-large;">Token:</label>
      <input style="text-align:center; font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-weight: bolder; font-size: x-large;" type="text" id="token" name="token" placeholder="Enter your token" required>
    </form>

I have double-checked and the "text-info" CSS is not causing it at all and I've tried removing all the other CSS styling/references to classes I can see without solving the problem. I've included an image of the code as well.

Code

Solution

It's because your labels don't have the same width. Words, even with the same number of letters, can be smaller / wider than each other, depending on the font you use. An "W" take generally more space than a "I", for exemple.

What to need to do is to either put a width / min-width on your label, use columns or use a table. You can probably do something else too, but, in the end, you need to make sure there is some kind of "space separation" between your labels and inputs.

Answered By - NetSkylz