flatpickr: Flatpickr layout wrong after update to 4.4.1

After updating Flatpickr to version 4.4.1 from version 4.3.2 the layout of the picker is wrong

My config:

{
  enableTime: true,
  weekNumbers: true,
  allowInput: true,
  enableSeconds: true,
  locale: {
    firstDayOfWeek: 1
  }
}

Reproduction Link

https://jsfiddle.net/tL7znbot/

Screenshot

screen shot 2018-03-26 at 17 59 57

Your Environment

flatpickr version used: 4.4.1
Browser name and version: Google Chrome 66
OS and version: MacOS High Sierra

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 2
Comments: 15 (3 by maintainers)

Links to this issue

flatpickr 4.4.2 发布，Javascript 日期选择器 - 腾讯云开发者社区-腾讯云

Most upvoted comments

Happening here too after upgrading to 4.4.4. It looks like @RedShift1’s image. The config is

{
    inline: true,
    static: true,
    enableTime: true,
    altInput: true
}

The main thing for me is that the date picker is not visible when the page loads, one of its parent element’s display is toggled later on. .flatpickr-calendar and .flatpickr-days have a style="width: 1px" on them for some reason.

Adding this fixes the issue for me:

.flatpickr-calendar, .flatpickr-days {
    width: auto !important;
}

abrenneke on Apr 30, 2018

I tried re-creating your issue using that config, but it works fine for me. I think you need to do some more digging.

ThomHurks on Mar 27, 2018

Thanks for reporting this @ThomHurks @RedShift1 @Chris1904 v4.4.3 is out with the fix

chmln on Mar 27, 2018