28172 sujets

CSS et mise en forme, CSS3

Bonjour, je voudrais spécifier un retour à la ligne sans <br /> à l'intérieur des balises <a></a>

Si je met <p> ou <div>, le validateur W3C (XHTML 1.0 transitional) ne passe pas.
Modifié par darkstar2023 (05 Nov 2009 - 18:17)
Visiblement
<li>
<a>
<span style="display:block;padding:0;margin:0;"><img src=""></span>
TEXTE ICI
<a>
</li>


Fonctionne et est valide
Modifié par darkstar2023 (17 Oct 2009 - 00:18)
Salut,

darkstar2023 a écrit :
je voudrais spécifier un retour à la ligne sans <br /> à l'intérieur des balises <li></li>
Si je met <p> ou <div>, le validateur W3C (XHTML 1.0 transitional) ne passe pas.
Il n'y a pourtant aucune raison puisque DIV et P font partie de la liste des éléments enfants autorisés de LI.
Quand je met <p> dans un élément de liste le validateur XHTML 1 transitionnal me retourne une erreur du genre element "p" not allowed here from lists on

Tous les éléments en ligne sont admis et les éléments blocks visiblement non.


EDIT : oops en fait ce n'est pas la balise <li> qui refuse les éléments block mais la balise <a>
Donc ma nouvelle question est : comment spécifier un retour à la ligne entre les balises <a></a> sans <br /> ?
Modifié par darkstar2023 (17 Oct 2009 - 15:20)
Line 66, Column 43: document type does not allow element "p" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag

<ul>
<li><a href="index.php?s=aa"><p><img alt="" src="flag_fr.gif" border="0" /></p>Lien</a></li>
...
</ul>

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").
Modifié par darkstar2023 (05 Nov 2009 - 16:38)
p est élément de type bloc, a de type en ligne (inline en anglais). Un élément de type en ligne ne peut pas avoir d'éléments de bloc comme éléments descendants. Ce qui explique l'erreur relevée par le validateur : un élément p ne peut être descendant de a.

En revanche, l'élément a peut recevoir comme élément enfant n'importe quel élément en ligne (à l'exception de a). Parmi les éléments en ligne, il y a span. Corrige donc ton code (X)HTML comme suit :
<ul>
<li><a href="index.php?s=aa"><span><img alt="" src="flag_fr.gif" border="0" /></span>Lien</a></li>
</ul>

Et pour avoir l'effet visuel demandé, CSS est ton amie :
li span {
  display: block;
}

Si tu ne sais pas distinguer les éléments de type bloc de ceux de type en ligne, lis le tuto intitulé Comprendre la structure HTML et le rendu CSS des balises : bloc et en-ligne. Smiley cligne
Modifié par Victor BRITO (17 Oct 2009 - 15:34)