NFT-preview-solution-using-html-css

Community feedback

• 

  Adarsh•1,640

  @adram3l3chPosted almost 3 years ago

  you can either add a new div or wrap the image in a div.

  <div class="image-wrapper"> <img/> </div>

  style{ .image-wrapper::after{ content:""; position:absolute; inset:0; background:/that cyan with a less opacity/ opacity:0; } .image-wrapper:hover::after{ opacity:1; } }

  Marked as helpful

  0
• 

  Erel Ropeta•385

  @ereljapcoPosted almost 3 years ago

  1. You can make the on hover effect by adding a div inside the div container of the equilibrium image. Then add the view image inside the newly created div. Make use of the position property where the new div is placed on top of the equilibrium. Set the background-color of the new div to the primary. Then set the opacity of the new div to 0. Then set the opacity of the new div on hover to 0.x.

  2. For the accessibility issues, you can use main tag instead of div tag for the div.container and footer tag for the div.attribution.

  Marked as helpful

  0