z-index isn't applied

There's actually two reasons:

  1. Its parent is set to show up behind the logo. Any z-index applied to elements within that parent element will only apply to other elements within that parent. All the elements within the parent will be stacked accordingly, then that entire element will be put behind the logo as specified by its stack order.

  2. A z-index only applies to elements with position of absolute, fixed, or relative. It does not apply to elements with static position.


It is constrained by the parent container's z-index. You cannot set a child to a higher z-index than the parent; it caps at the parent's value.

You could make the stripes a background of the body tag and then set the container to have no background. Once that is done set container to a higher z-index.`

Tags:

Css