akirem

Latest comments

• 

  Mofe•440

  @Mofe620

  Submitted about 3 years ago

  

  NFT Preview Card Component with TailwindCSS

  #styled-components#tailwind-css

  1

  40
  

  akirem•270

  @Akirem749

  Posted about 3 years ago

  html- put the icon in an overlay <div>

  .overlay{ width: image-width; height: image-height; position: absolute; //make the card container position:relative background-color: hsla(178, 100%, 50%, 0.4); top: 20px; //image-position left: 20px; //image-position opacity: 0; border-radius: 10px; transition: opacity .3s; display: flex; //to center the icon justify-content: center; align-items: center; }

  .overlay:hover{ opacity: 1; cursor: pointer; }

  0

  Marked as helpful