search

uxsolutions / bootstrap-datepicker

A datepicker for twitter bootstrap (@twbs)
Apache License 2.0
12.67k stars 6.06k forks source link

input-daterange and css alignment problem with bootstrap #2682

Open slolo2000 opened 1 year ago

slolo2000 commented 1 year ago

Expected behaviour

With the last version, there is a problem with range and bootstrap 4.

Normally I should have this: normal_1_10_0

cf. jsfiddle : https://jsfiddle.net/69xgm4th/

Actual behaviour

But with the last version 1.10.0 (and previous one) I have this behavior: bug_1_10_0

cf. jsfiddle: https://jsfiddle.net/adocupx9/

Datepicker version used : v1.10.0

Example code

Simply add input-daterange class and the problem appears.

See above for examples.

slolo2000 commented 1 year ago

I have found a trick.

Simply put lines below in comment in bootstrap-datepicker3.css (and bootstrap-datepicker3.min.css) and it does the job:

.input-daterange .input-group-addon {
  width: auto;
  min-width: 16px;
  padding: 4px 5px;
  line-height: 1.42857143;
  border-width: 1px 0;
  margin-left: -5px;
  margin-right: -5px;
}