Si quieres poner una imagen encima de la otra, ambas imágenes deben estar posicionadas de forma absoluta, en otro caso no se pueden colocar una encima de la otra.
Una vez tienes una foto sobre la otra debes hacer uso del Z-index para indicar en qué orden se deben renderizar las imágenes.
Veamos el funcionamiento con un ejemplo.
HTML.
<img src="https://childmind.org/wp-content/uploads/2021/08/care-photo.png" class="img" />
<img src="https://childmind.org/wp-content/uploads/2021/08/CMI_GrowthRings-Care.svg" class="img2">/>
<img src="https://childmind.org/wp-content/uploads/2021/08/CMI_GrowthRings-Care.svg" class="img2">/>
CSS.
<style>
img
{
position:absolute;
left:0px;
top:0px;
z-index:-1;width:30%;height:auto;
}
.img2
{
position:absolute;
left:40px;
top:10px;
z-index:-3;
}
</style>
RESULTADO.
¡¡Aprender es interesante y divertido!!
| Salu2 y bendiciones, Atte, Angel Paz |  |
