2014-07-25 1 views
1

나는 bootstrap-datepicker을 가지고 있는데, 그 중 range 버전을 사용하고 있습니다. 오른쪽에서 button을 추가하여 사용자가 쿼리를 새로 고침 할 수있게하고 싶습니다. 일단 그들이 날짜를 변경했습니다.Jade & Bootstrap-Datepicker & 인라인 버튼

나는 신원 확인을 시도했지만 일부는 inline-block 스타일링이지만 작동하지 않습니다. button가 나타나지만 모든 것이 엉망입니다.
다음은 button이 의도 한대로 배치되지 않은 datepicker의 예입니다.

.input-group.date 
     #datepicker.input-daterange.input-group 
      input#StartDate.input-sm.form-control(type='text', name='start', placeholder='Date 1') 
      span.input-group-addon to 
      input#EndDate.input-sm.form-control(type='text', name='end', placeholder='Date 2') 
      button.btn.btn-default.btn-sm(type='button', style='margin-left:8px;') 
        i.fa.fa-refresh 

답변

2
당신과 같이 버튼을 감싸 어떤 경우

:

.input-group.date 
    #datepicker.input-daterange.input-group 
     input#StartDate.input-sm.form-control(type='text', name='start', placeholder='Date 1') 
     span.input-group-addon to 
     input#EndDate.input-sm.form-control(type='text', name='end', placeholder='Date 2') 
     span.input-group-btn 
      button.btn.btn-default.btn-sm(type='button', style='margin-left:8px;') 
       i.fa.fa-refresh 

참조 : http://getbootstrap.com/components/#input-groups-buttons

+0

감사합니다! 이제 클래스'input-group-btn'에 대해서 알게되었습니다. –