Question

我有一个bootstrap-datepicker，我正在使用它的range版本，在右边我想添加button来制作它用户可以在更改日期后刷新查询。

我尝试过标识和一些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

翡翠＆amp; Bootstrap-Datepicker＆amp;内联按钮

1 个答案: