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的引导不正确的显示

回答

相关问题