how to place an image over another image in html
<!--Change the values of top and left to change the location of the images-->
<!--If you want to change which image is infront use z-index: (index number)-->
<!--The higher the z-index number will be displayed infront-->
<style>
.parent {
position: relative;
top: 0;
left: 0;
}
.image1 {
position: relative;
top: 0;
left: 0;
border: 1px red solid;
z-index: 2;
}
.image2 {
position: absolute;
top: 30px;
left: 30px;
border: 1px green solid;
z-index: 1;
}
</style>
<body>
<div class="parent">
<img class="image1" src="https://placehold.it/50" />
<img class="image2" src="https://placehold.it/100" />
</div>
</body>