When the calendar is shown at (user) zoom levels different than 100%, the calendar may show split days in a distorted way. See attachments.

Does anyone know a way to solve this? Or to break this question down:
- how to detect a changed zoom level (or how to detect the actual zoom level on load)?
- Would it be possible to correct these distortions by playing around with the style settings?
- Has anyone played around with the code at detect zoom (at github) and its demo?

Any help or suggestion would be welcomed.

ScreenHunter_11 Aug. 21.jpg

ScreenHunter_12 Aug. 21.jpg

Comments

fietserwin’s picture

The following seems to work fine and even gives us the option to work with real gradients

Sharp transition:

background-image: -moz-linear-gradient(-45deg, blue, blue 50%, red 50%, red);

Gradient transient

background-image: -moz-linear-gradient(-45deg, blue, red);

TODO: compatibility (and syntax) check for other browsers and fallback for browsers that do not support it.