/ / twitter bootstrap typeahead dropdown - html, css, ruby-on-rails-3, html5, twitter-bootstrap

lista desplegable de twitter boottrap typeahead - html, css, ruby-on-rails-3, html5, twitter-bootstrap

Hola, estoy usando Twitter Bootstrap. He usado typeahead en mi ventana modelo. Mi problema es que cuando escribo en el cuadro de texto, el menú desplegable es perfecto, pero aparece en la parte inferior del cuadro de texto. He observado que hay un conjunto superior de atributos cuando viene el menú desplegable. Pero no sé cómo cambiar eso en el tiempo de ejecución.

Aquí está la imagen: enter image description here

No soy bueno en CSS. ¿Alguien puede decirme que debería hacer para resolver este problema?

Respuestas

1 para la respuesta № 1

Es necesario anular algunos de los estilos predeterminadosde la clase typeahead en bootstrap. Específicamente, puedo lograr que aparezca correctamente al establecer la posición en relativa y el índice z en 10000. La propiedad de posición requiere que uses la declaración! Important.

.typeahead {
position:relative !important;
z-index:10000;
}​

Ver mi violín de trabajo en http://jsfiddle.net/technotarek/Msttw/.

Tenga en cuenta que mis valores de typeahead son el color del arco iris en caso de que tenga problemas para activarlo.

Además, dependiendo del diseño exacto de su formulario, es posible que deba ajustar la posición del elemento typeahead para su propia situación mediante el uso de las propiedades CSS superior / inferior o izquierda / derecha.