Jade & Bootstrap-Datepicker &内联按钮

Question

我有一个自举-数据报警器，我正在使用它的range版本，在右边，我想添加一个button，使用户在更改日期后刷新查询成为可能。

我试过了I和一些inline-block样式，但它不起作用。button出现了，但整件事都搞砸了。

下面是datepicker示例，其中的button没有按预期放置。

.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

Answer 1

如果你用这样的方式包裹按钮呢：

.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