typeahead on bootstrap 3

Question

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

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

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

Answer 1

Try this . Hope it helps.

.dropdown-menu { width: 100%; }

UPDATE: Check this out.

Answer 2

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

Check this FIDDLE

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

Answer 3

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