-
Notifications
You must be signed in to change notification settings - Fork 127
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support for input-group with input-group-addon element #20
Comments
due to the
|
mm, ok, seems to work indeed. When looking at this part of the source code, is it possible the class It seems #12 did not completely cover #11. Also see the classname here https://github.com/twitter/typeahead.js/blob/v0.11.1/src/typeahead/www.js#L14 Instead of supporting:
it might be beter to release a new version which bumps the required version of TypeAhead to |
yes, thanks. |
Great, thanks for the swift support. Since this change is backwards compatible, would it justify a new release with increased patch version? |
Context
When using TypeAhead on a search element, it would be nice to display a search icon next to the
<input/>
element, where this fiddle shows a few approaches on how to realize that.Problem
When using the simplest approach: an
input-group
with an icon wrapped in ainput-group-addon
, this seems to interfere with TypeAhead.This HTML
will be transformed by TypeAhead to something like:
Notice that the menu that contains the suggestion becomes part of the
input-group
element making it:<input/>
element<input/>
element. This makes it difficult for the user to continue its search adventure.Would it be possible to use plain CSS to prevent the menu from overlapping?
Seems to be related to:
UPDATE
As suggested in this comment adding
style="float: none;"
to the input element seems to resolve the overlapping issue for Safari, FireFox, Chrome, Internet Explorer 11, Microsoft Edge. Have not tested Internet Explorer < 11 yet.The text was updated successfully, but these errors were encountered: