Menu
I have div with opacity:0.80; property that contain text and button. The problem is that button and text also inheritance opacity from div. How to fix it?
I already tried to add opacity:1; to button and text <p> tag, but it does not helps.
510
For stop-color values that don't include explicit opacity information, the opacity is treated as 1 . Note: As a presentation attribute, stop-opacity can be used as a CSS property. You can use this attribute with the following SVG elements: <stop>
Answer: Use the CSS RGBA colors There is no CSS property like "background-opacity" that you can use only for changing the opacity or transparency of an element's background without affecting its child elements.
Basically, you can't override the opacity of a child. The answer you might be looking for will depend on what it is you are actually trying to do. Paulie is right, opacity effects the entire element (including children) and can't be reversed by a child element.
I think you want the opacity on the background instead. As Prisoner said, not supported by old browsers.
background-color: rgba(0, 0, 0, 0.8);
w3schools: RGBA color values are supported in IE9+, Firefox 3+, Chrome, Safari, and in Opera 10+.
77
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
