이 이상한 패딩을 부트 스트랩 형태로 수정하는 방법은 무엇입니까?

Question

<form class="form-inline"> 
    <div class="form-group"> 
     <div class="input-daterange input-group" id="datepicker"> 
      <label>From:</label> 
      <input type="text" class="input-sm form-inline" name="start" /> 
      <span class="input-group-addon"><i class="fa fa-calendar fa-lg" aria-hidden="true"></i></span> 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="input-daterange input-group" id="datepicker"> 
      <label>To:</label> 
      <input type="text" class="input-sm form-inline" name="end" /> 
      <span class="input-group-addon"><i class="fa fa-calendar fa-lg" aria-hidden="true"></i></span> 
     </div> 
    </div> 
</form> 

I 입력에 대한 클래스 = "폼 제어"를 변경할 때, 확인 될 것이지만, 또한 해결 전체 형태 :(

Answer 1

의 크기를 변경 :

<form class="form-inline"> 
    <div class="form-group"> 
     <div class="input-daterange" id="datepicker"> 
      <span>From:</span> 
      <div class="input-group"> 
       <input type="text" class="input-sm form-inline" name="start"/> 
       <span class="input-group-addon"><i class="fa fa-calendar fa-lg" aria-hidden="true"></i></span> 
      </div> 
     </div> 
    </div> 
    <div class="form-group"> 
     <div class="input-daterange" id="datepicker"> 
      <span>To:</span> 
      <div class="input-group"> 
       <input type="text" class="input-sm form-inline" name="end"/> 
       <span class="input-group-addon"><i class="fa fa-calendar fa-lg" aria-hidden="true"></i></span> 
      </div> 
     </div> 
    </div> 
</form>