Chrome autofill is populating multiple fields

I have the following HTML.

First of all, Chrome is ignoring the autocomplete="off", but worst is that when you choose an email to autocomplete, Chrome populates all of the input fields with the same address - overwriting any existing data. what am i missing?

<form autocomplete="off">
  <div class="form-group">
    <label> Email addresses: </label>
    <div class="input-group mb-3">
      <input class="form-control" type="email" name="recipient-0">
    </div>
    <div class="input-group mb-3">
      <input class="form-control" type="email" name="recipient-1">
    </div>
    <div class="input-group mb-3">
      <input class="form-control" type="email" name="recipient-2">
    </div>
  </div>
  <button type="submit" class="btn btn-primary">
    Request
  </button>
</form>