Question

I’ll provide CSS and HTML sources first.

jsFiddle

The live example is here

The problem is, h2 texts are not visible unless I do z-index: -1; on images. It makes the text appear, however, then the image is being lost and I look at body background.

There is not something touching z-index values except the fixed navigation bar at top.

What may be causing this, can you have a look?

Ps. Writing z-index: 2; on H2 tags doesn’t work either.

Answer 1

If you want z-index:2 on <h2> works, you should add position:relative; or position:absolute; or position:fixed.

You can see z-index