jQuery provoque des avertissements de dimensionnement de la boîte de Firefox

J’ai l’extension WebDeveloper et un avertissement CSS, alors je suis allé l’examiner. L’avertissement est 3 des éléments suivants:

Warning: Unknown property 'box-sizing'. Declaration dropped. Line: 0 

Puis j’ai fait un fichier vierge et j’ai remarqué qu’il n’y en avait pas. Quelques minutes plus tard, j’ai trouvé une cause reproductible: notamment le script jQuery 1.9.1!

Que puis-je ou dois-je faire? Je veux utiliser jQuery, mais je trouve un peu gênant de toujours voir les avertissements CSS dans ma barre d’outils.

     
Empty

Les options

  1. Utilisez jQuery 1.7.2.
  2. Résoudre le problème avec l’équipe de jQuery et espérer une solution (ou en fournir une vous-même).
  3. Utilisez Firebug au lieu de WebDeveloper (ce qui peut aider ou non).
  4. Ignore le.

Tant que la page s’affiche correctement, je pense qu’il s’agit d’un avertissement que vous pouvez ignorer en toute sécurité, même si vous construisez un site Web nécessitant ssortingctement de valider le code CSS.

Les avertissements devraient disparaître dès que Firefox aura pleinement pris en charge le box-sizing de la box-sizing (sans exiger le préfixe -moz- ), mais cela n’arrivera pas avant certaines versions postérieures à Firefox 21.

Informations de fond

L’avertissement provient des différentes syntaxes nécessaires pour certains styles CSS. Pour prendre en charge tous les navigateurs, vous devez généralement spécifier toutes les syntaxes. Les navigateurs ignoreront ceux qu’ils ne reconnaissent pas.

Dans le cas de la box-sizing de la box-sizing , Firefox requirejs le préfixe -moz- , les premières versions de Safari Mobile et le navigateur Android nécessitent le préfixe -webkit- , tandis que les autres navigateurs ne nécessitent aucun préfixe:

 -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; 

Un problème similaire se pose lors de l’ajout d’un dégradé linéaire, dans ce cas causé par la valeur plutôt que par le nom de la propriété:

 background-image: -webkit-linear-gradient(top, #444, #999); background-image: -moz-linear-gradient(top, #444, #999); background-image: -ms-linear-gradient(top, #444, #999); background-image: -o-linear-gradient(top, #444, #999); background-image: linear-gradient(top, #444, #999); 

Lorsque des avertissements découlent des différentes syntaxes utilisées, il s’agit en général du fait que le validateur ou la console d’erreur ne sont pas assez intelligents pour reconnaître un problème réel comme un problème inoffensif souvent inévitable. Et pour être juste, il est en fait identifié comme un avertissement, pas une erreur.

information additionnelle

Les versions les plus récentes de jQuery utilisent le style de box-sizing des box-sizing à des fins internes. jQuery 1.8.0 ne produit qu’un seul avertissement de box-sizing , et jQuery 1.7.2 n’en produit aucun.

jQuery l’utilise peut-être de manière légèrement imprudente – sans test préalable si elle est supscope – mais sans faire de mal. Si tel est le cas, si suffisamment de personnes s’en plaignent auprès de l’équipe jQuery, le code jQuery pourrait potentiellement être remanié pour résoudre ce problème (au prix de jQuery tournant un peu plus lentement).

Si l’avertissement concernait -moz-box-sizing plutôt que box-sizing , cela suggérerait probablement un bogue possible avec Firefox plutôt qu’un problème mineur avec jQuery.

Selon les gens de jQuery, il s’agit d’un problème lié à Firefox et ils ne peuvent rien y faire. Depuis Firefox 27 (beta), cela se produit encore. Voir: http://bugs.jquery.com/ticket/13569