@MahmoodHashem
Posted
Hello there
Congratulations on completing the challenge!*
You did a fantastic job, and there's no need to feel any different. However, I suggest exploring a different method that requires less code.
<div class="image">
<img src="./images/image-equilibrium.jpg" alt="eye">
<div class="overlay">
<img src="./images/icon-view.svg" alt="">
</div>
</div>
.image{
position: relative;
}
.overlay{
position: absolute;
top: 0;
display: none;
justify-content: center;
align-items: center;
background-color: hsla(178, 100%, 50%, 0.398);
width: 100%;
height: 100%;
border-radius: 14px;
}
.image:hover .overlay{
display: flex;
cursor: pointer;
}
Great Job overall
Marked as helpful