Set maxlength in html input without changing form width? - ruby-on-rails

Question

I have a sign up form and want to limit the length of the First Name and Last Name fields to 50 characters.
The problem is, when I do, the form displays much wider.
How can I make sure the user cannot enter more than 50 characters into those form fields without it affecting the width of the form?
Reference
Here is the code/result before and after (the only change is the addition of the maxlength: 50 to the form helper.
Before:
<div class="row">
<div class="col-6">
<div class="field">
<%= f.label :first_name %><br />
<%= f.text_field :first_name, autofocus: true, autocomplete: "First Name", class: "form-control" %>
</div>
</div>
<div class="col-6">
<div class="field">
<%= f.label :last_name %><br />
<%= f.text_field :last_name, autocomplete: "Last Name", class: "form-control" %>
</div>
</div>
</div>
<br>
After (too wide):
<div class="row">
<div class="col-6">
<div class="field">
<%= f.label :first_name %><br />
<%= f.text_field :first_name, maxlength: 50, autofocus: true, autocomplete: "First Name", class: "form-control" %>
</div>
</div>
<div class="col-6">
<div class="field">
<%= f.label :last_name %><br />
<%= f.text_field :last_name, maxlength: 50, autocomplete: "Last Name", class: "form-control" %>
</div>
</div>
</div>
<br>

Answer 1

I hadn't realised, but when rails sees maxwidth: 50, it automatically adds: size: 50.
I simply add a size: 25 to the form field helper and the width of those fields becomes 25 rather than 50
<div class="row">
<div class="col-6">
<div class="field">
<%= f.label :first_name %><br />
<%= f.text_field :first_name, maxlength: 50, size: 25, autofocus: true, autocomplete: "First Name", class: "form-control" %>
</div>
</div>
<div class="col-6">
<div class="field">
<%= f.label :last_name %><br />
<%= f.text_field :last_name, maxlength: 50, size: 25, autocomplete: "Last Name", class: "form-control" %>
</div>
</div>
</div>
<br>