Imagen sobre imagen

[gspablo]

Buenas, tengo una imagen en mi pagina, pero ahora quiero ponerle una imagen con simbolo + y otra con símbolo - para redimensionar la página, entonces no se como hacer para que las imagenes de la lupa se vean por encima de la imagen principal

Os pego el código a ver si me ayudais

PD: He visto código por internet pero en todos usan position:absolute, left y right, el problema es que si la página la ven en diferentes monitores saldrá movida y no se verá una justo encima de la otra no?

quiero que productos_01.png aparezca debajo de la otra que es lupa.png, lupa solo tapara un poco de la imagen

Código HTML:

<table id="Tabla_01" width="1051" height="2001" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td colspan="21">
            <img src="productos/productos_01.png" width="1050" height="504" alt="" >
            <img align="center" src="lupa.png" width="472" height="64" alt="" >
            </td>
        <td>
 

Gracias!!

[BloodShadow]

tenes que usar position absolute y relative por ley... lo de los tamaños de los monitores no es problema ya que tenes un tamaño fijo que es 1051... te dejo un ejemplo para que veas como seria mas o menos

CSS

Código HTML:

.contenedora-imagen{ position: relative; width: 1050; height: 504; }
.contenedora-lupa { position: absolute; bottom: 10px; right: 10px; width:10px; height: 10px }

HTML

Código HTML:

<div class="contenedora-imagen">
     <img src="productos/productos_01.png" width="1050" height="504" alt="" >
     <div class="contenedora-lupa">
          <img align="center" src="lupa.png" width="472" height="64" alt="" >
     </div>
</div> 

veo que una lupa de 472px de ancho es mucho, una lupa no pasa de 10px a 30px exagerando... pero aya tu como la tienes jajaj

espero te sirva... nos vemos