Le bug des labels implicites sous IE6 et 7

Buffer

Stop IE 6

Je suis tombé ce week-end (je ne sais plus où, mais si vous trouvez, merci de me donner le lien) sur la description d’un bug sous IE 6/7 qui m’avait posé pas mal de problèmes à une époque, et je ne pense pas être le seul à l’avoir subi : la répétition du style des labels sur les input, qui se traduisait le plus notamment par un incompréhensible doublement des marges intérieures et extérieures.

Ce symptôme se produit quand vous cherchez à imbriquer le label et l’input afin de faire du labeling implicite :

<label>Test <input type="text" name="test" /></label>

Internet Explorer 6 et 7 interprète le HTML comme si vous aviez fait :

<label>Test</label>
<label><input type="text" name="test" /></label>

Si vous n’imbriquez pas label et input, Internet Explorer 6 et 7 se comportent normalement :

<label for='test'>Test</label> 
<input type="text" name="test" id='test' />

Si je tenais le type qui a codé ça, je lui facturerais volontiers le temps passé à essayer de comprendre le comportement du couple label / input en cas d’imbrication.

Buffer
Publié le 14 septembre 2009 à 19h03 Publié sous et Labels webdev, css, html, ie6, bug

À propos

Frédéric de Villamil

Je m'appelle Frédéric de Villamil, et quand je ne déploie pas ma mauvaise humeur et ma mauvaise foi sur le Web, je suis un super héros chargé de sauver le monde. Vous pouvez me suivre sur Twitter.

  1. Luc le 14 septembre 2009 à 21h52

    Je suis quasiement toujours complètement d’accord avec tes articles.

    celui la, je ne comprend pas trop ?

    sémantiquement parlant, mettre l’input dans le label ça sert a quoi ?

    concerètement, on déclare : label for=”iddelinput”

    donc c’est LE label DU champ.

    hors, si on place l’input DANS le label.

    l’input devient partie intégrante du label.

    et donc l’input devient le label lui même.

    c’est récursif non ?

  2. Frédéric de Villamil le 14 septembre 2009 à 22h14

    Comme je le dis dans mon article, l’id du champs à labeliser n’est pas toujours possible.

    Là, tu indiques implicitement au label à quel input il correspond. D’où le nom de label implicite.

    Si tu fais un test avec la syntaxe du label implicite, tu verras que le comportement est exactement le même qu’avec un label for (à tester sur tous les navigateurs et les lecteurs d’écrans, je n’en avais pas sous la main).

  3. Luc le 15 septembre 2009 à 00h02

    Merci des eclairsissement, je n’avais pas noté l’abscence d’ID dans les premiers exemples…

    ça me semble tout de suite plus logique.

  4. Amo le 15 septembre 2009 à 10h14

    Merci du tuyeau ;-) vivement que le utilisateurs d’IE passent (pour un moindre mal) sur IE8

Réagir à Le bug des labels implicites sous IE6 et 7

Afin de maintenir le niveau global de ce site, les commentaires font l'objet d'une politique de modération qualitative basée sur des critères non écrits et totalement subjectifs, donc injustes.

Les commentaires écrits en langage SMS, inutiles, déplacés, injurieux ou relevant du spam seront systématiquement supprimés sans avertissement préalable.

Les trackbacks sont fermés pour cause de spam.