First, let's define a CSS class. Let's call this class ".double":
Code:
<style type="text/css">
.double img {
position:absolute;
}
</style>
Then let's apply it to all images within a span belonging to our ".double" class:
Code:
<span class="double">
<img src="imageOne.gif">
<img src="imageTwo.gif">
</span>
This will cause all images to fall within one position, since they all belong to the same class whose position is absolute. If you wish to position the images at the center of each other, you might have to contain the span within a defined div space and align them at center. However, if you use uniformedly-sized images, these should not be an issue.
:mrgreen: You can indefinitely add more images to the scuffle. Hehe. You can experiment with transparent animated gifs or png files to create a layered effect. Please show us your work soon.
This is the simplest way I could think of. Maybe others have better ideas.