Mettre 2 images l'une sur l'autre

Je suis en train de faire un Cluedo-esque de style de site web où les gens peuvent soupçonner les gens ou de les déclarer innocent.
Quand j'ai personne est innocente, je veux mettre une croix rouge sur leurs photos.

Mais actuellement je suis aux prises de position de tout.
J'ai réussi à mettre 2 images l'une sur l'autre, mais pas sur la bonne position.

Situation actuelle: Une table avec des images dans la première rangée.
C'est le CSS ajoutée pour les photos:

<td><img src="bottom.jpg" style="z-index: 0; position: absolute"  />
    <img src="top.png"    style="z-index: 1; position: absolute"/>
</td>

Mettre 2 images l'une sur l'autre

Comment la position de deux de mes images?
Retrait de la "position: absolute" ne fonctionne pas, donc comment je peux résoudre ce problème et de toujours garder les deux photos dans la cellule du tableau.

La solution devrait fonctionner pour toutes les photos dans la table (un général de la classe CSS pour les images (en haut/en bas).

Merci!

MODIFIER après Fabio suggestion

Il a résolu une partie du problème, mais pas entièrement.
C'est la situation actuelle avec le code exact que vous avez suggéré:

Mettre 2 images l'une sur l'autre

OriginalL'auteur Matt | 2014-08-19