使动作适应div类

Question

我使用下面的代码作为我的登录表单，该表单调用了动作“loginRequestHandler.jsp＆＃39;”。

   <form action="loginRequestHandler.jsp">
                <table cellpadding="5">
                    <tr>
                        <td><b>UserID</b></td>
                        <td><input type="text" name="email" required/></td>
                    </tr>

                    <tr>
                        <td><b>Passwort</b></td>
                        <td><input type="password" name="password" required/></td>
                    </tr>

                    <tr>
                        <td colspan="2" align="center"><input type="submit" value="Login"/></td>
                    </tr>

                </table>
            </form>

如何根据以下代码段调整我的需求？我最近下载了一个响应式模板，但这个登录表单正在杀了我......

<div class="login-form">
     <h1>SmartHome</h1>
     <div class="form-group ">
       <input type="text" class="form-control" placeholder="Username">
       <i class="fa fa-user"></i>
     </div>
     <div class="form-group log-status">
       <input type="password" class="form-control" placeholder="Password">
       <i class="fa fa-lock"></i>
     </div>
      <span class="alert">Invalid Credentials</span>
      <a class="link" href="#">Lost your password?</a>
     <button type="button" class="log-btn" >Log in</button>    
   </div>