How can I make a wrapper's css not apply to it's contained elements [closed]


Tags: html,css

Problem :

I have a container div that has some opacity. I would like to keep it a container, so I can retain the automatic height. How do I retain the styles of the container, without them applying to all of the contents within it?



Solution :

With the opacity property this is not possible. If it's just a background color on the container the best solution is to use rgba() or hsla() for your color since they contain an alpha (opacity) value.


    CSS Howto..

    CSS: How to produce rounded boxed list

    How can I debug twitter bootstrap v4-alpha grid? col-sm-offset-* not working

    How to create a caption for a pure CSS/HTML Slider with thumbnails, no java/jquery

    How does Grails process static files without resources plugin?

    How to change both fill and stroke in svg with css

    How to figure out the CSS bugs?

    CSS: how to address Samsung Android browser?

    CSS `will-change` - how to use it, how it works

    How to center a single character both vertically and horizontally in a square div

    How to re-use common css rules in css( sass ) [closed]

    How do i set the relative path and folder paths in HTML and CSS from VS 2012?

    how to align the content of a box

    How to display code on iPhone using HTML/CSS

    How to rotate a picture using css and javascript

    CSS how to select first occuring element after another element

    How to define multiple CSS attributes in JQuery?

    How to extract icon from picture and display it in page? (by javascript or jquery or css)

    jQuery increase box to show overflow contents

    How to click CSS with a space using Selenium Webdriver

    How to change the slide picture when resize browser size

    How do I go about dynamically splitting a body of text into two even columns with plain Javascript (no JQuery)?

    HTML – Show menu on hover

    How to change Polymer(1.0) paper-toolbar background colour?

    How can I make the left div expand and the right div have constant width?

    How to reveal part of blurred image where mouse is hovered?

    How to get content of a specific css column

    How to override PrimeFace CSS to customize my button?

    How do I align my radio button with associated text?

    How to clear css cache

    How to keep grid width if colums are switched in column menu