How to make the background DIV only transparent using CSS

Question

I am using CSS attrubutes     filter  alpha opacity 90             opacity   9    to make the DIV transparent  but when I add another DIV inside this DIV it makes it transparent also   I want to make the outer background  DIV only transparent  How

User · Answer

background-image url  image img2 jpg     background-repeat repeat-x    Use some image for internal image and use this

User · Answer

Just do not include a background color for that div and it will be transparent

User · Answer

It s not possible  opacity is inherited by child nodes and you can t avoid this  To have only the parent transparent  you have to play with positioning  absolute  of the elements and their z-index

User · Answer

I don t know if this has changed  But from my experience  nested elements have a maximum opacity equal to the fathers   Which mean    lt div id  a  gt   lt div id  b  gt   lt  div gt  lt  div gt   Div a has 0 6 opacity div b has 1 opacity   Has  b is within  a then it s maximum opacity is always 0 6  If  b would have 0 5 opacity  In reallity it would be 0 6 0 5    0 3 opacity

User · Answer

I had the same problem  this is the solution i came up with  which is much easier   Make a little 1px x 1px transparent image and save it as a  png file   In the CSS for your DIV  use this code   background transparent url   images trans-bg png   repeat center top    Remember to change the file path to your transparent image    I think this solution works in all browsers  maybe except for IE 6  but I haven t tested

User · Answer

lt div id  divmobile  style  position  fixed  background-color  transparent      z-index  1  bottom 5   right  0px  width  50px  text-align center   class  div-mobile  gt

User · Answer

Fiddle  http   jsfiddle net uenrX 1   The opacity property of the outer DIV cannot be undone by the inner DIV  If you want to achieve transparency  use rgba or hsla   Outer div   background-color  rgba 255  255  255  0 9      Color white with alpha 0 9     Inner div   background-color   FFF     Background white  to override the background propery     EDIT Because you ve added filter alpha opacity 90  to your question  I assume that you also want a working solution for  older versions of  IE  This should work  -ms- prefix for the newest versions of IE      Padded for readability  you can write the following at one line    filter  progid DXImageTransform Microsoft Gradient      GradientType 1      startColorStr   E6FFFFFF       endColorStr   E6FFFFFF       Similarly     filter  progid DXImageTransform Microsoft Gradient      GradientType 1      startColorStr   E6FFFFFF       endColorStr   E6FFFFFF      I ve used the Gradient filter  starting with the same start- and end-color  so that the background doesn t show a gradient  but a flat colour  The colour format is in the ARGB hex format  I ve written a JavaScript snippet to convert relative opacity values to absolute alpha-hex values   var opacity    9  var A ofARGB   Math round opacity   255  toString 16   if A ofARGB length    1  A ofARGB    0  a ofARGB  else if  A ofARGB length  A ofARGB    00   alert A ofARGB

User · Answer

modalBackground                filter  alpha opacity 80           opacity  0 8          z-index  10000

[css] How to make the background DIV only transparent using CSS

Examples related to css

Examples related to html