Correct height adjustment for multiline inputs with input-group-lg and Bootstrap 3.2.0

[olegus8]

When using Bootstrap 3.2.0 and input-group-lg, tokenfield height remains fixed and multiline content is drawn outside of the input field.

There's no such problem with Bootstrap 3.0.0 though.

This fix works with both Bootstrap versions - 3.2.0 and 3.0.0.

[ragulka]

Interesting. I haven't had a chance to test with 3.2.0 yet, but is the !important part really necessary?

[olegus8]

Yep, I think it's ugly too. Here's what happens.

The offending element is <div class="tokenfield form-control">. It inherits height: auto style from .input-group-lg .tokenfield selector of Tokenfield's CSS and height: 46px from .input-group-lg > .form-control selector of Bootstrap's CSS.

Both selectors have same specificity, so they're resolved by order.

I thought it might be less fragile to put !important, so that the result doesn't depend on whether Tokenfield's CSS is included before Bootstrap's or vice versa.

If you have a better solution, I'm open for suggestions.

[olegus8]

You know, after careful consideration, I think it will do without !important. I'm using it with Meteor, which takes care of proper loading order. I updated and rebased my branch.

Any chances to get this PR merged?

Thanks for the great widget by the way! Coolest token field I've seen so far!

[olegus8]

Thanks man, you're awesome!