Effet de style bouton

Par melodie, il y a 3 ans

Les bases HTML/CSS

Bonjour,

J'aimerais faire un effet de style sur les bordures de mes boutons.

.qode-btn.qode-btn-solid { border: 6px solid black; border-style: double; padding: 2% } .qode-btn.qode-btn-solid:hover { background-color: #F7EFDB; border-style: solid; border-width: 2px; }

Ce que je veux

Je voudrais une double bordure fine de 1px chacune et au hover que celle du centre s'aggrandisse jusqu'à celle de l'exterieure. Je n'arrive pas à trouver le bout de code qui va bien.

Ce que j'obtiens

Pour le moment j'ai ce bout de code mais ça ne convient pas du tout, le rendu fait que la bordure extérieure est trop épaisse et au hover c'est celle-là qui disparait.

1 réponse

Grafikart, il y a 3 ans

Jpense que là tu vas devoir utiliser des pseudos éléments si j'ai bien compris l'effet. Sinon une autre solution est de jouer avec une autre stratégie pour créer plusieurs bordures sur un seul élément via :

  • border
  • outline
  • box-shadow