2013-09-30 112 views
0

我已經複製並粘貼來自bootstrap的示例代碼。我已經包含引導CSS和JS文件& jQuery庫。 Base CSS - BootstrapBootstrap標籤和輸入字段不顯示水平

由於某些原因,標籤和輸入字段顯示爲內聯。有人可以看看我做錯了什麼嗎?

<form class="form-horizontal"> 
      <div class="control-group"> 
      <label class="control-label" for="inputEmail">Email</label> 
      <div class="controls"> 
       <input type="text" id="inputEmail" placeholder="Email"> 
      </div> 
      </div> 
      <div class="control-group"> 
      <label class="control-label" for="inputPassword">Password</label> 
      <div class="controls"> 
       <input type="password" id="inputPassword" placeholder="Password"> 
      </div> 
      </div> 
      <div class="control-group"> 
      <div class="controls"> 
       <label class="checkbox"> 
       <input type="checkbox"> Remember me 
       </label> 
       <button type="submit" class="btn">Sign in</button> 
      </div> 
      </div> 
    </form> 
+0

你的'form'標籤看起來不錯,我相信你忘了添加容器''div' class&'<!DOCTYPE html>'HTML5 –

+1

把你的代碼放在jsfiddle上。 –

+0

您標記了Bootstrap 3的問題,但您鏈接到Bootstrap 2文檔,並且您擁有的代碼也是Bootstrap 2.如果您將上面的代碼掛鉤到Bootstrap 3 CSS,它將不起作用。 –

回答

0

嘗試使用.form-group而不是.control-group類。

記得在form標籤後面設置一個帶有.col- - *類的容器。

Ex。

<form class="" role="form" method="POST" action="{form_action}" onsubmit="return ValidateForm()" enctype="multipart/form-data"> 

    <div class="col-sm-6 col-md-6">  
     <div class="form-group"> 
      <label class="control-label label-fw">Vendida?&ensp;</label> 
      {chk_sold} 
     </div><!-- form group --> 

     <div class="form-group"> 
      <label for="txt_title" class="control-label label-fw">T&iacute;tulo&ensp;</label> 
      <input name="txt_title" type="text" class="form-control input" id="txt_title" value="{txt_title}" placeholder="titulo del producto"> 
     </div><!-- form group --> 

     <div class="form-group"> 
      <label for="txt_title" class="control-label label-fw">Categor&iacute;a&ensp;</label> 
      {cbo_type} 
     </div><!-- form group --> 

     <div class=""> 
      <label for="txt_aution_date_d" class="control-label label-fw">Fecha&ensp;</label> 
      <input name="txt_auction_date_d" type="text" class="form-control" id="txt_auction_date_d" value="{txt_auction_date_d}" placeholder="MM/DD/AAAA"> 
     </div><!-- form group -->      

    </div><!-- col-sm-6 col-md-6 --> 
    </form> 

讓我知道,如果工作。