I have a little problem (again) :

I have a lot of elements on the page (isometric map), nearly each with it's own z-index.
It's okay, they all respect their z-index priority (high z-index hide low z-index).

BUT theses two, a simple image (a black box) and a div with a text.

The image is always on top of the text, whatever z-index I put in the two.

The funny thing is theses two respect the z-index of all the others elements in the page. But whatever i do, "a1" is alway on top of "a2".

Meaning i can have this horrible thing : A1 on top of A2, on top of A3, on top of A1.

A1>A2>A3>A1 !

Who need to divise by 0 !

        <div id="ratsodie">
<img id="a1" width="90%" height="90%" src="ratsodie/interface/fond_ville.svg" style="position: absolute; z-index: 365; opacity: 08;">

<div id="a2" style="position:absolute; top: 10px; left: 10px; z-index: 375; opacity: 1; border: 3px solid rgb(0, 0, 0);"> ville 1 .</div>

Idea, somebody ?