Bonjour, j'ai souhaité transformer le premier carré bleu en lien vers une vidéo cependant, tout le texte dans le carré bleu s'affiche souligné en violet (et c'est moche). Comment enlever ces horribles lignes violettes sous le texte du carré bleu ?

Mon code -> https://codepen.io/Ekkaia/pen/BdZXPz

Merci d'avance <3

Hello,

Comme ceci ? -> https://jsfiddle.net/a31tkk3b/ 

.card-1 {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
    text-decoration: none;
}

Effectivement, c'est bien ça ! Merci ! Tant que j'y suis j'ai une autre question : pourquoi le carré bleu est décalé par rapport à l'autre carré bleu à côté ? Ils sont alignés quand il n'y a pas de texte pourtant...

Bonjour,

ce décalage vient du fait que des éléments en display: inline-block ont par défaut un vertical-align: baseline. Pour les aligner, ajoute vertical-align: top sur .card

Merci beaucoup ! Tout fonctionne  :1:

Parfait ! Dans ce cas, pense bien à marquer ton sujet comme résolu, merci d'avance.