<p> dentro de <li>

[novamen]

Buenas! Verán me estoy iniciando en HTML y tengo una consulta.
Me han dicho que no es muy apropiado meter un elemento <p> dentro de un <li>, pero no me han sabido explicar el porqué... ¿alguien podría explicarmelo?

muchas gracias!

[memoadian]

por que <p> es un elemento de bloque y <li> es un elemento lineal de modo que un elemento lineal nunca puede estar dentro de un elemento bloque.

[novamen]

pero es que tanto los P como los OL y LI son elementos de bloque no de linea (o eso he leido yo en infinidad de lugares...)

[DragonX]

Los elementos en línea definidos por HTML son: a, abbr, acronym, b, basefont, bdo, big, br, cite, code, dfn, em, font, i, img, input, kbd, label, li, q, s, samp, select, small, span, strike, strong, sub, sup, textarea, tt, u, var.

Los elementos de bloque definidos por HTML son: address, blockquote, center, dir, div, dl, fieldset, form, h1, h2, h3, h4, h5, h6, hr, isindex, menu, noframes, noscript, ol, p, pre, table, ul.

fuente: http://www.librosweb.es/css/capitulo...elementos.html

[zerokilled]

buenas,
no entiendo que tan mal tiene poner un elemento P dentro de LI. de hecho, es totalmente valido según el DTD.

Código:

<!ELEMENT LI - O (%flow;)*             -- list item -->
<!ENTITY % flow "%block; | %inline;">
<!ENTITY % block
     "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |
      BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

por otro lado, un LI no es un elemento lineal, sino de tipo lista. que en teoría se comporta como bloque pero con un añadido.

[novamen]

Iniciado por zerokilled

buenas,
no entiendo que tan mal tiene poner un elemento P dentro de LI. de hecho, es totalmente valido según el DTD.

Código:

<!ELEMENT LI - O (%flow;)*             -- list item -->
<!ENTITY % flow "%block; | %inline;">
<!ENTITY % block
     "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |
      BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

por otro lado, un LI no es un elemento lineal, sino de tipo lista. que en teoría se comporta como bloque pero con un añadido.

Muchisimas gracias zerokilled.

[DanielRGB]

cuando no estes seguro, pasa tu código por un validador.

Y dentro de un <li> yo he metido de todo.

<ul>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
</ul>

[emprear]

Más de lo mismo para que no queden dudas

<li> no está definido ni como un elemento lineal ni de bloque. Pero admite que se incluyan dentro de el elementos de bloque, el ejemplo más comun de esto son las listas anidadas

Código HTML:

<ul>
<li>Uno
   <ul>
   <li>Uno</li>
   <li>Dos</li>
   <li>Tres</li>
   </ul>
</li>
<li>Dos</li>
<li>Tres</li>
</ul>
 

Por lo tanto, la inclusión de <p> es completamente válida

Saludos

[memoadian]

Pues a mi en más de una ocasión me ha dado error el validador por meter un p en li, dandome esa corrección de error, de todos modos no veo el problema en que sea span o p a final de cuentas si es por apariencia se controla desde css.

ahorita no tengo el dato exacto de w3c pero lo voy a buscar.

[Tedel]

Yo he puesto <p> dentro de <li> sin problemas y varias veces.

[zerokilled]

@memoadian, te podría asegurar que la causa fue por otra cosa. y aunque bien la estética se maneja con css, eso no significa que por ello debemos renunciar al uso correcto de las etiquetas según su semántica. digo, cada cual al fin lo hace como quiera, pero sería lo más adecuado.

[memoadian]

Iniciado por zerokilled

@memoadian, te podría asegurar que la causa fue por otra cosa. y aunque bien la estética se maneja con css, eso no significa que por ello debemos renunciar al uso correcto de las etiquetas según su semántica. digo, cada cual al fin lo hace como quiera, pero sería lo más adecuado.

creo que tienes razón, de eso ha pasado mucho, y me he quedado con el mito, mal por mi



pido una disculpa

[novamen]

Iniciado por DanielRGB

cuando no estes seguro, pasa tu código por un validador.Y dentro de un <li> yo he metido de todo.

<ul>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
<li>
<h1>Título</h1>
<h2>SbuTítulo</h2>
<p>Cuerpo de texto</p>
<img src="" >
</li>
</ul>

eso hice, lo pasé por el validador y no daba error y aún así me decían que no era sintacticamente correcto... cuando vi que no sabían decirme el porqué fue cuando decidí pasarme por aquí.

muchas gracias a todos!