CSS calc avec inherit

Je voudrais utiliser inherit avec calc() comme ceci:

#foo {
  animation-duration: 10s;
}
#foo > .bar {
  animation-duration: calc(inherit + 2s); /* =12s */
}

Mais ça ne semble pas fonctionner.

Est-ce un bug des navigateurs ou des spécifications?

22
demandé sur Yukulélé 2014-02-06 18:42:50

1 réponses

Le mot clé inherit ne peut exister que seul en tant que valeur dans une déclaration de propriété. Il ne peut pas être utilisé avec autre chose en tant que valeur, car c'est une valeur en soi. Cela signifie qu'il ne peut pas non plus être utilisé avec des fonctions comme calc(). Voir CSS2.1 et CSS3-cascade.

De plus, la fonction calc() elle-même ne prend que des valeurs numériques littérales telles que des nombres, des dimensions et des pourcentages .

Donc, pour le dire simplement, la spécification ne permet pas d'utiliser inherit par là.

24
répondu BoltClock 2014-02-06 15:22:49