I am using Bootstrap 4. But when opening the dropdown component the font color is slightly changed.
After looking for some color definitions which could be the problem (there aren't) I found something strange: when I disable the transform and the will-change property of the dropdown element, somehow the font-color is affected. See video here:
https://www.dropbox.com/s/xkhl4m6enwvdzcd/Video%20color%20bug.mov?dl=0
It's most noticeable in Google Chrome and on a Cinema Display (Video).
Also it seems the subpixel font rendering is affected: see screenshot here . The fun thing: the font-color is rendered more accurately when it's off.
In Safari a font rendering issue also occurs ...
Any idea what is happening here?
(I can post a Code Pen, or see the id of it in the video.)
As Ilya Streltsyn and giovannipds have mentioned in the comments here and here, that's a normal side effect of alpha compositing (subpixel rendering), which is what the browser does as part of hardware-accelerated rendering (GPU) brought about by will-change and transform.
