Prepended input label (simple_form + bootstrap-sass) off by a few pixels

ruby-on-rails, simple-form, twitter-bootstrap

Solution

I don't really know what the problem is here, but I had the same thing.

Comparing the `span.add-on` tag I found that they had a `float: left` on theirs. I added that and it seemed to do the trick.

I also noticed they are using twitter 2.01. I'm using 2.02, so something might have changed.

EDIT: That messed up the append span.

.input-prepend .add-on,
.input-append input {
  float: left;
}

Is what I added. It doesn't feel right, but it's working for now. Hopefully someone else more knowledgeable of bootstrap can help out.

Problem

I want to use the text input field seen here: http://simple-form-bootstrap.plataformatec.com.br/articles/new (It's the second text input field on that page.) I have it working in other Rails apps but for some reason in my current one there is a several-pixel gap between the prepended label and the text input. I've installed simple_form with the `--bootstrap` option, and have verified that the Rails/haml/bootstrap/bootstrap-sass versions are the same as the working rails app. I don't override any of the related css in my stylesheets (I commented it all out to be sure). Any ideas why Bootstrap isn't behaving as it should?

Original source