How to fold a div over everything?

Question

I have a dynamic header that is fixed at the top of all pages. However, when I scroll down, some elements overlap on top of it:

Any ideas on how to fix this?

Answer 1

z-index: 1000 (or a value that is larger than other Z-indexes) in your CSS should work. The browser not only renders with the coordinates X and Y, there is also Z, which determines which layer will be on top. z-index does this.

You should probably avoid using this. A cleaner solution would be to fix the automatic indexing of the browser, for example (for example) by placing the elements in the correct order in your HTML.

Answer 2

This is usually done using the high z-index element:

 #element-id { z-index: 1000; }