How to place a label on a single row/ on a single line

Issue

Two labels get separated by a line. I need to fix that(Look at First Name, Last Name)

<section id="names">
    <B>First Name:</B><input type="text" name="Name" id="name">
    <B>Last Name:</B><input type="text" name="Surname" id="surname">
</section>

I don't know if they will help but here I wrote some useless css for it

#names {
    display:flex;
    flex-direction: row;
    float: left;
}

Solution

you can use white-space: nowrap;

#names {
    display:flex;
    flex-direction: row;
    float: left;
}

label {
  white-space: nowrap;
}

<section id="names">
    <!--use proper tags-->
    <label for="name">
       <b>First Name:</b>
    </label>
    <input type="text" name="Name" id="name">
    <label for="surname">
       <b>Last Name:</b>
    </label>
    <input type="text" name="Surname" id="surname">
</section>

Answered By - jade