Twitter的引導不正確的顯示

所以我在尋找這樣的：http://twitter.github.com/bootstrap/base-css.html#forms內聯形式.form-inlineTwitter的引導不正確的顯示

現在我的網頁上輸入看上去像有線他們沒有填充：

活生生的例子：在這裏：http://jsbin.com/ariret/1/edit

這裏是我的代碼：

 <div class="navbar"> 
     <div class="navbar-inner"> 
      <form class="form-inline" action="<?php echo $this->baseUrl('login'); ?>" id="form-login" method="post"> 
      <input type="text" class="input-small" id="email" name="email-login" placeholder="<?=$this->translate('Email');?>"> 
      <input type="password" class="input-small" id="password" name="password-login" placeholder="<?=$this->translate('Password');?>"> 
      <label class="checkbox"> 
       <input type="checkbox" name="keep-logged" value="1" id="check-logged"> <?=$this->translate('Remember me'); ?> 
      </label> 
      <input type="hidden" name="login_type" value="normal" /> 
      <button type="submit" class="btn"><?=$this->translate('Login');?></button> 
      </form> 
     </div><!-- end navbar-iner --> 
     </div><!-- end navbar -->

在這裏，它是如何看起來像：

enter image description here
它需要與登錄按鈕具有相同的高度。我的頁面上包含了css和js文件！

來源

2013-02-25 Uffo

您是否有任何自定義css影響您的輸入？這是很難調試只有看到HTML。一個鏈接到你的項目將是有益的。 – Jrod 2013-02-25 14:55:21

偉大的問題！這是一個jsbin鏈接，它重現了這個問題：http://jsbin.com/ariret/1/edit – GolfWolf 2013-02-25 14:59:42

@Jrod no，你可以在這裏看到：http://jsbin.com/ariret/1/edit thx w0lf – Uffo 2013-02-25 15:03:03

這似乎是Bootstrap的JSbin錯誤。其他測試站點（和本地主機）顯示此功能按預期工作。

Bootstrap將輸入字段的高度設置爲20px，但尚未得到應用。答案並不清楚，但您可以隨時前往https://github.com/remy/jsbin/issues/new並提交新問題。

來源

2013-02-25 15:05:53 Joshua

嗯，它只是刪除形式的馬林底，投入仍然沒有改變！就像在引導頁面示例 – Uffo 2013-02-25 15:08:26

剛剛編輯我的帖子。 – Joshua 2013-02-25 15:08:45

如果它需要這個類，它會顯示在[各自]（http://twitter.github.com/bootstrap/base-css.html#forms）頁面 – Starx 2013-02-25 15:10:33

您可以創建以下方法：

的jsfiddle在瀏覽器Jsfiddle in browser

<div class="navbar"> 
     <div class="navbar-inner"> 
      <div class="container-fluid"> 
       <div class="nav row-fluid"> 

         <form class="form-inline pull-right"> 
          <input type="text" placeholder="email or username" /> 
          <input type="password" placeholder="password" /> 
          <label class="checkbox"> 
      <input type="checkbox" name="keep-logged" value="1" id="check-logged"> <?=$this->translate('Remember me'); ?> 
     </label> 
     <input type="hidden" name="login_type" value="normal" /> 
          <button type="submit" class="btn">login</button> 
         </form> 

       </div> 
      </div> 
     </div> 
    </div>

來源

2013-02-25 15:20:30 Shail

「它需要有相同的高度登錄按鈕Working inline bootstrap form

結果我的CSS和js文件包含在我的頁面上！「

<button type="submit" class="btn btn-primary btn-mini">login</button>

將減少按鈕來（幾乎）的輸入

如果你想增加的投入高度對齊按鈕高度的高度，我建議你在本地覆蓋CSS

<style type="text/css"> 
.form-inline .input-small { 
    height: 30px; 
    margin-top: 3px; 
} 
</style>

這兩個「解決方案」在jsbin示例中工作 - http://jsbin.com/ariret/4/edit

來源

2013-02-25 15:23:34 davidkonrad

Twitter的引導不正確的顯示

回答

相關問題