How to place an image over an image

[siris]

I have a set of images which needs to be put one over the other vertically. Like I have to squares of equal size which I want to put on top of the first. I don't want to place it on it's side.

If I use <img src=&quot;images/x.gif&quot;><img src=&quot;images/y.gif&quot;> then both the images get displayed on side by side. Mind you that I'm already using tables to place the images. And the images may vary at run time. Actually I'm using an ASP to do that. But I want a simple HTML code to put it on top of each other.

Thanks in advance.

 

[crazyboybert]

you will need to use CSS to do this and place both images in the page using absoulte positioning. This way they can both occupy the same space. for example.

<div style=&quot;position:absolute; left:100px; top:100px;&quot; id=&quot;img1&quot;><img src=&quot;x.gif&quot;></div>
<div style=&quot;position:absolute; left:100px; top:100px;&quot; id=&quot;img2&quot;><img src=&quot;y.gif&quot;></div>

this will render both images in the same place (with y on top of x). There are other ways of achieving this without absolutely positioning both elements but it willl require some Javascript.....

hope this helps

 

[doublehelix]

You could avoid CSS by putting the bottom image as the background of a table, and the other image inside a cell in that table. I don't think that all browsers support a background image in a table though.