Входы разного размера bootstrap

Question

У меня есть эта проблема - мне нужно сделать 3 INPUT, 1 ширину (по ширине экрана) и ниже 2 маленьких (ровно половину ширины первого элемента INPUT), но получается что размер они не совпадают. Как сделать точные размеры ширины соответствия?

<form class="navbar-form"> 
<label>Where are you going?</label> 
<input type="text" class="span8" data-provide="typeahead" data-items="5" placeholder="City, attraction, address, or airport"> 
<label>When?</label> 
<input type="text" class="datepicker span4" id="dpd1" placeholder="Choose Arrive Date"> 
<input type="text" class="datepicker span4" id="dpd2" placeholder="Choose Depart Date"> 
</form> 

вы можете увидеть весь код here

Answer 1

Может быть, вы можете попробовать что-то вроде этого, чтобы избежать дополнительного пространства на входах:

<div class="wrapper"> 
    <div class="row-fluid"> 
     <input class="span12"/> 
    </div> 
    <div class="row-fluid"> 
     <div class='span6'> 
      <input class="span12"/> 
     </div> 
     <div class='span6'> 
      <input class="span12"/> 
     </div> 
    </div> 
</div> 

Demo