Skip to content
Submitted almost 3 years ago

Card NFT , Con FlexBox

Sergio Herrera•140
@santi19999
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...NFT preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

¿Que otra opción aparte de ::before hay? , para hacer el hover de la imagen..Saludos

Community feedback

  • Andrés Gutiérrez Ramírez•2,470
    @AGutierrezRPosted almost 3 years ago

    Excelente! Te ha quedado muy bien Sergio! he visto que la imagen que esta dentro de .card-header tiene un pequeño espacio abajo que ha hecho que apliques border-radius en la imagen y no en el padre.

    Para evitar ese espacio puedes aplicar en display: block en la imagen .card-header img y así podrías aplicar border-radius en .card-header con overflow: hidden

    Marked as helpful
    0
  • Jorge Maza•1,860
    @jormazlopPosted almost 3 years ago

    Hello! Otra opción que se me ocurre para lo de la imagen, es poner una imagen encima de otra, y jugar con la propiedad opacity al hacer hover sobre ellas.

    Marked as helpful
    0
  • Sergio Herrera•140
    @santi19999Posted almost 3 years ago

    También podría ser otra opción, tienes razón. Gracias por tu aporte, saludos!

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord