我如何在其他元素上方显示html选择

Question

我有一个注册页面，其中我有一个电话字段，当我选择该字段时，弹出窗口显示在其他元素下面。

  

    

我想知道为什么手机字段选项显示在以下选项下方？

  

     

请参阅：

     

我正在使用的代码：

1. 登录up.jsp

   在这里输入代码

           <form action="Controller" method="GET" id="form">
           <input type="hidden" name="command" value="registration"/>
           <table class="sign-up-div-table">
               <tr>
                   <td colspan="2"> <h3>Join us for free</h3> </td>
               </tr>
   
               <tr>
                   <td> <input type="text" name="firstname" class="form-control" placeholder="First name" required/> </td>
                   <td> <input type="text" name="lastname" class="form-control" pattern="^[A-Z][-a-zA-Z]+$" placeholder="Last name" required/> </td>
               </tr>
   
               <tr>
                   <td colspan="2"> <input type="email" name="email" class="form-control" placeholder="Email address" required  onkeyup="check(this.value)"/> </td>
               </tr>
   
               <tr>
                   <td colspan="2"> <div id = "mydiv"></div> </td>
               </tr>
   
               <tr>
                   <td colspan="2"> <input type="password" name="password" class="form-control" placeholder="Password" required/> </td>
               </tr>
   
               <tr>
                   <td> <jsp:include page="demo.html"></jsp:include> </td>
               </tr>
   
               <tr>
                   <td colspan="2"> <div id = "numberdiv"></div> </td>
               </tr>
   
               <tr>
                   <td colspan="2">
                       <div class="input-group input-group-xs">
                           <span class="input-group-addon" style="width: 100px; background-color:#a2a587; color: white;" >Birthday</span>
                           <select name="date" class="form-control" style="background-color: #c7cca7;" required>
                               <option disabled selected value> select date </option>
                               <jsp:include page="dates.jsp"></jsp:include>
                           </select>
   
                           <select name="month" class="form-control" style="background-color: #c7cca7;" required>
                               <option disabled selected value> select month </option>
                               <jsp:include page="months.jsp"></jsp:include>
                           </select>
   
                           <select name="year" class="form-control" style="background-color: #c7cca7;" required>
                               <option disabled selected value> select year </option>
                               <jsp:include page="years.jsp"></jsp:include>
                           </select>
   
                       </div>
                   </td>
               </tr>
   
               <tr>
                   <td colspan="2">
                       <div class="input-group input-group-sm">
                           <span class="input-group-addon" style="width: 100px;">Gender</span>
                           <select class="form-control" name="gender" style="width: 300px;" required>
                               <option disabled selected value> select gender </option>
                               <option>male</option>
                               <option>female</option>
                               <option>other</option>
                           </select>
                       </div>
                   </td>
               </tr>
   
               <tr>
                   <td colspan="2">
                       <div class="input-group input-group-sm">
                           <span class="input-group-addon" style="width: 100px;">Position</span>
                           <select class="form-control" name="position" style="width: 300px;" required>
                               <option disabled selected value> select position </option>
                               <option>Writer</option>
                               <option>Author</option>
                               <option>Contributor</option>
                               <option>Teacher</option>
                               <option>Student</option>
                           </select>
                       </div>
                   </td>
               </tr>
   
               <tr>
                   <td colspan="2" align="left"> <input type="submit" value="Get Started" class="btn btn-success btn-lg"/> </td>
                   <td></td>
               </tr>
   
           </table>
       </form>