CODEWITHSUNDEEP
csstwitter-bootstrapbootstrap-typeahead
newbie
newbie

Reputation: 1980

typeahead on bootstrap 3

Currently I'm using this typeahead but it display like this:

enter image description here

Ist possible to display the typeahead, same width as the input?

What I tried so far is:

.dropdown-menu {    
    display: block; position: static; width: 100%; 
}

But this break the lower fields

enter image description here

Check my fiddle

UPDATE:

I tried both of @neel shah and @shin solution and this is the result. I don't know why in the fiddle is not looking this way

enter image description here

Upvotes: 0

Views: 622

Answers (3)

shin
shin

Reputation: 3649

Try this. Hope it helps.

.dropdown-menu { width: 100%; }

UPDATE: Check this out.

Upvotes: 1

4dgaurav
4dgaurav

Reputation: 11506

$('.typeahead').typeahead({})
on('typeahead:opened',function(){$('.dropdown-menu').css('width',$('.typeahead').width() + 'px');});

Upvotes: 0

neel shah
neel shah

Reputation: 2271

The problem is with position: static you just need to remove it from the css

Check this FIDDLE 

.dropdown-menu { display: block; width: 100%; }

Upvotes: 1

Related Questions