CODEWITHSUNDEEP
cssgoogle-chrometransparencyrgba
Levon
Levon

Reputation: 199

CSS rgba transparency bug in Chrome?

Just placing a DIV with white background and any opacity value:

background-color: rgba(255, 255, 255, .5);

over a white (255x3) background. Actually DIV's background will be 254/254/254. This happen only in Chrome. FF/IE/Opera/Safari is ok.

Bug?

Upvotes: 9

Views: 4459

Answers (3)

James Smith
James Smith

Reputation: 538

This can now be fixed with the new will-change property. Specifically, will-change: transform;

Upvotes: 1

Stelian
Stelian

Reputation: 181

The weird behaviour is still present in Chrome 38 and Canary 40. The fix that worked for me was to add a transform: translateZ(0); to the div with the rgba background.

Upvotes: 3

Möhre
Möhre

Reputation: 939

This looks like a bug!

I can confirm this misbehaviour. Got it also by using background: rgba(255,255,255,0.1). More weird: the calculated style says background-color: rgba(255, 255, 255, 0.0980392)

It is hard to see on cheaper displays using TN technology, but still possible to screenshot and measure with e.g. Photoshop.

This question is similar to:
webkit bug: input's background gets gray without any reason on focus?

Upvotes: 4

Related Questions