Menu
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?
863
Transparency using RGBA In addition to RGB, you can use an RGB color value with an alpha channel (RGBA) - which specifies the opacity for a color. An RGBA color value is specified with: rgba(red, green, blue, alpha). The alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque).
If you want to remove the opacity or transparency from the sticky navigation bar, just navigate to Theme Options -> General -> Additional CSS and copy/paste this code and save changes. You could also manipulate the opacity by altering the value “1” at the end of the CSS statement.
So how do you use RGBA? rgba (100%, 0%, 0%, 1); The fourth value denotes alpha and needs to be between 0.0 (absolute transparency) and 1.0 (absolute opacity). For example, 0.5 would be 50% opacity and 50% transparency.
The primary difference is, the opacity applies to its sub-elements too. In contrast, rgba() applies the transparency of the colour to that particular element only. For example, opacity is set to the div element that contains text and has a border.
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?
133
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.
43
This can now be fixed with the new will-change property. Specifically, will-change: transform;
20
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
