Text Field in Drop-down Menu-Survey form Project

Hello everyone, today I need your help with a Html problem primarily.

I’m creating the Survey Form for the challenge and I wanted to add a text field to the end of the drop-down menu.

As you can see In the survey I’m asking users if they use any of the major computer OS’es and I wanted the user to be able to name their specific OS in a text field at the end of the drop-down menu.

Please mind that the code is not even close to being done and CSS development has not started (I work on Html first and then add CSS after all the main content has been made).

<!DOCTYPE html>
<!--
    this is how you comment
-->
<html>
    <!--this is the link to the CSS for the form and main element
    8/21/2020-->
      <!--The name attribute specifies the name of an <input> element.
         The name attribute is used to reference elements in a JavaScript, 
        or to reference form data after a form is submitted. 8/28/2020-->
<link rel="stylesheet" href="Surveyform.css">
<!--This is the link to the JS for Testing-->
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
<main id="main">
<div class="container">

    <header class="header">

    <h1 id="title" class="text-center">What are your Technology preferences?</h1>
    <p id="description" class="description text-center">Thank you for taking this survey! This survey improves the content of the blog to accommodate all users.</p>
</header>
<!--The form is below this line-->
<form id="survey-form">
    <div class="form-group">
        <label id="name-label" for="name">Name</label>
        <input
        type="text"
        name="name"
        id="name"
        class="form-control"
        placeholder="Enter Name Here"
        required
        />
</div>
<div class="form-group">
<label id="email-label" for="email">Email</label>
<input
type="email"
name="email"
id="email"
class="form-control"
placeholder="Enter Your Email Please"
required/>

</div>
<div class="form-group">

    <label id="number-label" for="number"
    >Age<span class="clue">(optional)</span></label
  >

  <input
    type="number"
    name="age"
    id="number"
    min="10"
    max="99"
    class="form-control"
    placeholder="Age"
  />
</div>
<div class="form-group"></div>
<p>What OS do you use as your main computer Operating system?</p>
<select name="Computer OS Dropdown" id="dropdown" class="form-control" required>

<option disabled selected value>Select OS</option>
<option value="Windows 10">Windows 10</option>
<option value="Windows 7">Windows 7</option>
<option value="Mac OS">Mac OS</option>
<option value=Linux>Linux</option>
<Option value="Other"></Option>



</select>


</div>

</form>





</main>

</html>

Think you can help?

Thanks in advance, Ben

Correction to original post: The “Other” Option is there as a placeholder, that “Other” Option tag is where I want the text field to be. Just wanted to clarify