2016-10-28 27 views
0

因此,我正在建立一個網站,現在我有一個註冊表格,我可能只是使它看起來像地址等東西來右邊和個人信息停留在左邊。從表單向右移動一些字段

截至目前我

<section id="form"><!--form--> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-sm-4 col-sm-offset-1"> 
       <div class="login-form"><!--login form--> 
        <h2>Login to your account</h2> 
        <form method="post"> 

        <div id="login-error"></div> 

         <input id="login-mail" type="email" placeholder="Email Address" /> 
         <input id="login-pass" type="password" placeholder="Password" /> 

     <button id="login-  submit" type="submit" class="btn btn-default">Login</button> 
        </form> 
       </div><!--/login form--> 
      </div> 
      <div class="col-sm-1"> 
       <h2 class="or">OR</h2> 
      </div> 
      <div class="col-sm-4"> 
       <div class="signup-form"><!--sign up form--> 
        <h2>New User Signup!</h2> 
        <form name="signup-form" action="/register" method="post" > 
         <input required id="sign-up-name" type="text" placeholder="Name"/> 
         <input required id="sign-up-surname" type="text" placeholder="Last Name"/> 
         <input required id="sign-up-mail" type="email" placeholder="Email Address"/> 
         <input required id="sign-up-phone" type="tel" placeholder="Telphone"/> 
         <input required id="sign-up-gsm" type="tel" placeholder="Mobile Phone"/> 
         <input required id="sign-up-pass" type="password" placeholder="Password"/> 
         <input required id="sign-up-pass-re" type="password" placeholder="Password again"/> 
         <input required id="sign-up-street" type="text" placeholder="Street"/> 
         <input required id="sign-up-nr" type="text" placeholder="Nr"/> 
         <input required id="sign-up-postalcode" type="text" placeholder="Postalcode"/> 
         <input required id="sign-up-city" type="text" placeholder="City"/> 
         <input required id="sign-up-country" type="text" placeholder="Country"/> 
         <button id="sign-up-submit" type="submit" class="btn btn-default">Signup</button> 
        </form> 
       </div><!--/sign up form--> 
      </div> 
     </div> 
    </div> 
</section> 

我讀過一些有關跨度,但我試了一下,並沒有真正發揮作用。所以在這裏。這是我需要在CSS或HTML中編輯的東西,我在找什麼?

回答

0

您是否提供了參考bootstrap.min.css 我加參考使用class="form-control"用於輸入 形成控制這就是你正在尋找 - https://jsfiddle.net/pmankar/qh6sav52/

嘗試調整輸出窗格怎麼看你的最終頁面將被顯示。