Alternatives illégales <br> ou <p> dans <li> balises sur un hover?

Quelqu'un a une suggestion pour la création de l'alinéa ligne de type espaces à l'intérieur d'un <li> balise qui comprend un planait pop-up pseudo-classe?

J'ai un <span> qui s'affiche sur l' a:hover et je veux que le texte qui apparaît être divisée en 2 paragraphes. Il fonctionne avec <br> dans FF, mais je veux faire la bonne chose (maintenant que j'ai découvert, c'est mal!)...

html:

<div id="rightlist">
  <ul>
      <li><a href="">List item
          <span>
             words words words that are "paragraph" 1 of List item
             <br><br>
             different words that make up "paragraph" 2 of List item
          </span></a></li>

css:

#rightlist {
margin-top: 10px; margin-right: 5px; width: 387px ; height: 239px ;
background-color: #7EBB11 ;
display: table-cell; 
z-index: 100 ;
    float: right ;
}

#rightlist ul {
  text-align: left;
margin: 0;
   margin-top: 6px;
font-family: sans-serif;
font-size: 20px ;
color: black ;
}

#rightlist a 
{
    display: table-cell;
text-decoration: none; color: black; 
background: #7EBB11 ; 
}

/*appearance of the <a> item (but before the <span> tag) on hover*/
#rightlist a:hover {
color: white;
}

/*appearance of the spanned content within <a></a> tags when not hovered */
/* %%%%% important - keep position:absolute in this div %%%%% */
#rightlist a span {
display: none;
position: absolute ;
margin-left: -412px;
top: -10px; left: 10px; padding: 10px ;
z-index: 100;
width: 380px; height: 222px; 
color: white;  background-color: #7EBB11;
font: 0.75em Verdana, sans-serif; font-size: 13px ; color: black;
text-align: left;
}



/*appearance of spanned content within <a> tags when hovered*/
#rightlist a:hover span {
display: table-cell ;
}
Ce qui vous fait penser que ces balises sont illégales à l'intérieur d'un élément de la liste?
Je suppose que le fait que les <ul> est stricte à ce sujet de descendants directs (doit être <li>s seulement) suggèrent que les mêmes restrictions s'appliquent à <li>. Ils n'en ont pas.

OriginalL'auteur | 2009-01-09

  1. 1

    Votre problème peut venir du fait que vous êtes en utilisant un <span> balise incorrecte.

    Travées sont censés être des éléments en ligne et vous êtes style comme s'il s'agissait d'un élément de type block. Il est vrai que vous pouvez obliger une durée à se comporter comme un élément de bloc en ajoutant le bon style, mais cela peut ne pas toujours être honoré par les différents navigateurs.

    Idéalement, vous devriez être en utilisant un div à la place. Vous pouvez alors utiliser les balises p ou encore des balises div pour indiquer les paragraphes (idéalement p, car du point de vue sémantique, ils sont en réalité des paragraphes plutôt que sans rapport avec les blocs de texte).

    mais puis-je mettre un <div> dans un <li>? Je pensais que c'était contre les specs?
    Il n'y a rien de ce que je connais dans le HTML ou XHTML spécifications qui leur interdit. Il y a une liste d'interdictions dans le XHTML spec [w3.org/TR/xhtml1/#prohibitions], mais les divisions au sein des éléments de la liste ne sont pas mentionnés.
    En fait, si vous regardez la DTD (<!ÉLÉMENT LI - O (%flux;)* -- élément de la liste -->), vous remarquerez qu'il y a ne sont pas toutes les interdictions que ce soit, il serait, je pense, être indiqué, par exemple -(DIV).

    OriginalL'auteur inferis

  2. 16

    Err il n'y a rien de mal à avoir <br> à l'intérieur de <a> ou <span>. Il est parfaitement valide, selon le HTML 4.01 spec.

    Edit: <li> peut contenir <p>, <br>, et à peu près rien d'autre.

    La spec est un peu dur à lire, mais en gros dit:

    • LI peut contenir block ou inline
    • block est faite de P + quelques autres choses
    • inline est faite de special + quelques autres choses
    • special est faite de A + BR + quelques autres choses

    Concernant <a> il dit:

    • A peut contenir inline sauf A
    • inline... voir ci-dessus
    assurez-vous - mais je l'ai à l'intérieur <li> , je pense que c'est "légal" de problème!
    Ce n'est pas un problème juridique. LI peut contenir ce que vous voulez.

    OriginalL'auteur Greg

  3. 1

    Vous pourriez rester une autre période de il y a comme un "faux" balise p:

      <li><a href="">List item
      <span>
         <span>words words words that are "paragraph" 1 of List item</span>
         <span>different words that make up "paragraph" 2 of List item</span>
      </span></a></li>

    Et dans votre css:

    #rightlist span span {display:block;margin:...}

    Note tout ce que vous déclarez pour #rightlist span s'appliquent à #rightlist span span, de sorte que vous pourriez avoir besoin pour remplacer certaines règles #rightlist span span.

    Tx Oli, mais cela a mis les deux blocs les uns sur les autres comme distinctes, mais d'instances simultanées en vol stationnaire. Serait ok si chaque paragraphe de texte est de taille connue (je pourrais spécifier la taille et la position de n ° 2 de sorte qu'il est ci-dessous n ° 1 etc), mais malheureusement ce n'est pas le cas. Encore à me gratter la tête au-dessus de ce..

    OriginalL'auteur Oli

  4. 0

    Pourquoi est-il "Mauvais"?

    votre balise br devrait peut-être être codé comme: 

     <br />
    désolé, terrible tapant: W3C suggère fortement d'éviter que, dans une 4.01 document....
    Où ? - Je suis tout à fait d'apprendre! (Aussi votre question n'a pas d'état HTML 4.01)
    C'est dans le rapport de validation de ce que j'ai pour la page qui a le code html. Vous avez raison, doit avoir spec'd 4.01, désolé!

    OriginalL'auteur Mesh

  5. -4

    Pourquoi est votre façon actuelle de mal ?

    Vous pouvez essayer ce

    <span>
  <p>words words words that are "paragraph" 1 of List item</p>
  <p>different words that make up "paragraph" 2 of List item</p>
</span>
    <p> n'est-ce pas autorisés à l'intérieur <span>
    C'est tout à fait le point de ce post, Kim. Vous n'êtes pas autorisé à placer les éléments de niveau bloc (div, p, ul, ol, etc) à l'intérieur des éléments, comme une, durée, etc. C'est contre les specs.

    OriginalL'auteur Kim