Child <div> w/ z-index disappears when parent <div> is assigned a background color
I assigned a div an index value of -2 which worked fine, but then to set a background color at 100% I added a parent <div> and set the background color to it. When I set the background color, the z-index div disappeared, if I take away the background color off then the z-index div appears. How can I set a background color to this div and still have the blue accents visible?
For clarification on that snippet above. <div id="grey"> is the overall parent <div> I added to set a background color at a width of 100%. <header> is the parent of <div class="blueBackerBottom"> (which is just the blue accent block sent to the background of <header>. I am trying to keep <div class="blueBackerBottom"> as the background of <header> but still want to apply an overall backgound color to <div id="grey">. Does that make sense?
No! If you need a given background image or color; then set it as a background. Playing the stacking order is just going to make maintenance a stroke causing experience. You are not going to accomplish anything of value with an approach like this. It make exactly zero sense.
ahh, figured it out... quite simple actually. 1 z-index on one block... not much of a maintenance issue at all but then I guess my stroke causing stress level is set to a much lower threshold than others.