search

kenwheeler / slick

the last carousel you'll ever need
kenwheeler.github.io/slick
MIT License
28.47k stars 5.89k forks source link

Slick with React in Chrome causing blurry and discolored fonts #3127

Open mikechuck opened 7 years ago

mikechuck commented 7 years ago

Hey I have found a problem with slick on Google chrome. I'm not sure if this is already known or not.

We have created a component in react using slick to display these wine products. We have noticed that the lines and fonts seem to be blurry, and the colors are also not correct, even though element has the correct color after being inspected.

Screenshot of the slick implementation: screen shot 2017-09-18 at 12 52 24 pm

According to our code, the inspector, and the computed styles in the inspector, this is supposed to be the same color as the blue text in this screenshot: screen shot 2017-09-18 at 12 52 36 pm

Let me know what you guys think, and apologies if this issue has already been raised, I couldn't find one.

louie-mogul commented 6 years ago

Looks like a 3d transform subpixel rendering issue

mikechuck commented 6 years ago

@louie-mogul Do you think this is a Chrome bug, or a bug with Slick? Do you think there's any way around it?

Thanks.

louie-mogul commented 6 years ago

@mikehchuck Its a chrome rendering bug but you could try mitigating it by making your containers a pixel higher.