Bonjour la communauté !

Je vais être bref car c'est un petit problème qui ne devrait pas prendre de temps à être résolu !

Je veux faire un effet de zoom sur un bouton au survol de la souris comme ceci :

#btnStart:hover,
#btnStart:focus{
    color: snow;
    background-color: rgba(0,78,160,0.8);
    transition: color 0.25s linear, background-color 0.25s linear;
    transform: scale(1.2);
}

La transformation se fait correctement, seulement je voudrais que ça ne se fasse pas d'un coup mais plutôt que cela se déroule sur 0.25sec comme les autres transitions. J'ai fait plusieurs recherches où j'ai plus ou moins trouvé ce que je voulais, j'ai inspecté le code mais je ne trouve pas c'est bizarre. J'ai également retourné le code dans tous les sens mais rien n'y fait !

J'espère que vous avez la solution Je vous remercie !

Tu l'as fait pour color et background-color, qu'est ce qui te gêne avec transform ?

Et bien quand j'essaie de le faire pour le transform, ça ne fonctionne plus (le transform ne s'exécute même plus, ni d'un seul coup, ni avec un "duration-time"). C'est pour cela que je ne comprends pas.

Salut, 

J'ai du mal à comprendre ton problème, le code que tu donne est censé fonctionner. Pour ma part j'aurais simplifié sa comme ça : 

transition: 0.25s linear;

Du coup, toute ce qui sera dans ton bloc CSS aura cette transition. 

Constate par toi même la simplicité de ton problème : 

https://jsfiddle.net/n7r322ap/

Ne vous embêtez plus ! J'ai trouvé Un petit bug de raisonnement de ma part sûrement... 

J'ai bien regardé et j'me disais "mais pourquoi je fais pas exactement pareil que pour les autres transitions ?". Je sais c'est bête, mais je croyais le faire. Bref, voici le code qui fonctionne si jamais ça peut aider une autre personne :

#btnStart:hover,
#btnStart:focus{
    color: snow;
    background-color: rgba(0,78,160,0.8);
    transform: scale(1.25);
    transition: color 0.25s linear, background-color 0.25s linear, transform 0.25s ease-out;
}

Merci beaucoup pour vos réponses en tout cas !