Question

我想使用此处显示的文本输入字段：

http://simple-form-bootstrap.plataformatec.com.br/articles/new

（这是该页面上的第二个文本输入字段。）

我在其他Rails应用程序中工作但由于某些原因，在我当前的版本中，前置标签和文本输入之间存在几个像素的间隙。我已经使用--bootstrap选项安装了simple_form，并验证了Rails / haml / bootstrap / bootstrap-sass版本与working rails app相同。

我没有覆盖样式表中任何相关的css（我对此进行了评论以确定）。

为什么Bootstrap的行为不正常？

Answer 1

我真的不知道这里有什么问题，但我有同样的事情。

比较span.add-on代码，我发现他们的float: left就是.input-prepend .add-on, .input-append input { float: left; }。我补充说，它似乎做了伎俩。

我也注意到他们正在使用twitter 2.01。我使用的是2.02，所以可能会有所改变。

编辑：这搞砸了追加范围。

{{1}}

是我添加的内容。它感觉不对，但它现在正在运作。希望其他更了解bootstrap的人可以提供帮助。

Answer 2

我没有查看更改以了解原因，但我可以确认它在2.0.1中按预期工作，并且在2.0.2中有所描述的差距。要恢复旧的正确行为，您可以使用以下命令替换Gemfile中现有的bootstrap-sass行：

gem 'bootstrap-sass', '2.0.1'

并更新您的捆绑包。

Answer 3

您需要添加：content_tag :span, "attribute", :class => "add-on", :style => 'margin-right: -5px;'

Answer 4

如果由于验证而导致页面出错，则接受的解决方案将导致问题。 Simple_form实际上有一个包装器，允许你这样做，并且在处理错误时要好得多。

<%= f.input :name, :wrapper => :append, :class => "inline" do %>
    <%= f.input_field :name%>
    <%= content_tag :span, "@", :class => "add-on abbn" %>
<% end %>

前置输入标签（simple_form + bootstrap-sass）关闭几个像素

4 个答案: