Make form inputs float correctly - html

Question

I have this form:
I want the last name input to be on the same line as the first name. I used float-left for both of them but it doesn't work.
.first-name {
float: left;
margin-right: 20px;
}
.last-name {
float: left;
}
input,
label {
display: block;
}
<form action="" method="POST">
<section>
<div class="first-name">
<label for="first-name">First name</label>
<input type="text" id="first-name" required> </div>
<div class="last-name">
<label for="last-name">Last name </label>
<input type="text" id="last-name" required></div>
<br style="clear:both;" />
</section>
<section>
<label for="company">Company </label>
<input type="text" id="company" required>
<label for="email">E-mail</label>
<input type="email" id="email" required>
</section>
<input class="submit" type="submit" value="REGISTER">
</form>

Answer 1

Use flexbox to solve this.
section.justify-content-btw {
display: flex;
justify-content: space-between;
}
input,
label {
display: block;
}
<form action="" method="POST">
<section class="justify-content-btw">
<div class="first-name">
<label for="first-name">First name</label>
<input type="text" id="first-name" required> </div>
<div class="last-name">
<label for="last-name">Last name </label>
<input type="text" id="last-name" required></div>
<br style="clear:both;" />
</section>
<section>
<label for="company">Company </label>
<input type="text" id="company" required>
<label for="email">E-mail</label>
<input type="email" id="email" required>
</section>
<input class="submit" type="submit" value="REGISTER">
</form>