609 votes

Met une div à l’intérieur d’une ancre jamais correct ?

J'ai entendu dire que mettre un élément de bloc à l'intérieur d'un élément inline est un HTML péché:

<a href="http://www.mydomain.com"><div>
What we have here is a problem. 
You see, an anchor element is an inline element,
and the div element is a block level element.
</div></a>

Mais que diriez-vous si vous le style de l'extérieur ancrage display:block dans la feuille de style? Est-il toujours tort? Le HTML 4.01 spécifications sur le niveau des blocs et des éléments inline semble le penser:

Les feuilles de Style offrent les moyens de spécifier le rendu de l'arbitraire les éléments, y compris si un élément est rendue sous la forme de bloc ou en ligne. Dans certains cas, comme une ligne de style pour les éléments de la liste, ce qui peut être approprié, mais d'une manière générale, les auteurs sont découragés de remplaçant la classique l'interprétation des éléments HTML de cette façon.

Quelqu'un aurait-il des conseils supplémentaires sur cette question?

860voto

NickFitz Points 14977

Selon la version de HTML vous êtes de restauration à:

  • HTML 4.01 spécifie qu' <a> éléments ne peuvent contenir que des éléments inline. Un <div> est un élément de bloc, de sorte qu'il peut ne pas apparaître à l'intérieur d'un <a>.

    Bien sûr, vous êtes libre de style d'insertion de l'élément tel qu'il apparaît à un bloc, ou un effet de style un bloc de sorte qu'il est rendu en ligne. L'utilisation des termes" inline et block dans le HTML fait référence à la relation des éléments de la structure sémantique du document, alors que les mêmes termes dans les CSS sont liées plus pour le style visuel des éléments. Si vous apportez des éléments inline afficher dans une polyédrique manière, c'est très bien.

    Cependant, vous devez vous assurer que la structure du document de sens que si le CSS n'est pas présent, par exemple lors d'un accès via une technologie d'assistance, comme les lecteurs d'écran - ou, en fait, lorsqu'il est examiné par le puissant Googlebot.

  • HTML 5 stipule que l' <a> élément "peut être enroulé autour de l'ensemble des paragraphes, des listes, des tableaux, et ainsi de suite, même des sections entières, tant qu'il n'y a pas de contenu interactif à l'intérieur (par exemple, de boutons ou d'autres liens)".

83voto

Eloff Points 5224

Non, il ne sera pas valider, mais oui il généralement fonctionnera dans les navigateurs modernes. Cela étant dit, utilisez une travée à l’intérieur de votre ancre et définissez `` sur elle ainsi, cela fonctionnera certainement partout, et il sera validé !

35voto

Ewan Todd Points 5201

Le W3C doc n'utilise pas de concepts comme le mal et le péché, mais elle n'utiliser celles-ci comme de fournir les moyens, peut être approprié et découragé.

En fait, dans le deuxième alinéa de l'article 4, le 4.01 spec détaille ses paroles comme suit

Les mots clés "DOIT", "ne DOIT PAS", "REQUIS", "DEVRA", "ne DOIT PAS", "DEVRAIT", "ne DEVRAIT PAS", "RECOMMANDÉ", "MAI", et "FACULTATIF" dans ce document doivent être interprétés comme décrit dans [RFC2119]. Cependant, pour des raisons de lisibilité, ces mots n'apparaissent pas dans tous les majuscules dans le présent cahier des charges.

Avec cela à l'esprit, je crois que la déclaration définitive est en 7.5.3 au niveau des blocs et des éléments en ligne, où il est dit

Généralement, les éléments en ligne peuvent contenir que des données et d'autres éléments en ligne.

La condition "en général" semble introduire suffisamment d'ambiguïté pour dire que HTML 4.01 ne permettent éléments inline pour contenir les éléments de bloc.

Certes, CSS2 a une valeur de propriété d'affichage, inline-block, qui semble être adapté à l'objectif que vous décrivez. Je ne suis pas sûr si elle a jamais été largement pris en charge, mais il semble que quelqu'un a prévu pour ce genre de comportement.

La DTD semblent être moins indulgent ici, mais le texte de la DTD reporte à la spécification:

La spécification HTML 4.01 inclut d'autres syntaxique des contraintes qui ne peuvent être exprimées au sein de la Dtd.

Dans un autre commentaire, vous suggérez que vous voulez faire un bloc actif en l'enveloppant dans un point d'ancrage. Je ne crois pas HTML interdit, et le CSS permet clairement. Donc, pour répondre à la question titre, de savoir s'il est toujours correct, je dis oui. Par les normes, il est parfois correct.

18voto

Abir Points 41

Avec la spécification HTML5... Il est maintenant possible de mettre un élément de niveau bloc à l’intérieur d’un élément en ligne. Alors maintenant, c’est tout à fait approprié de mettre un « div » ou « h1 » à l’intérieur d’un élément « a ».

5voto

Greg Points 132247

Vous ne pouvez pas mettre à l’intérieur de -ce n’est pas valide (X) HTML.

Même si vous le style une travée avec affichage : bloc vous toujours ne peut pas mettre les éléments de niveau bloc à l’intérieur : le (X) HTML doit toujours obéir au (X) HTML DTD (quel que soit celui que vous utilisez), peu importe comment le CSS modifie les choses.

Le navigateur affichera probablement ce que vous voulez, mais cela ne rend pas ce droit.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X