Anidar elementos a nivel de bloque dentro de la etiqueta <p>... ¿correcto o incorrecto?
¿Es sintáctica y semánticamente correcto anidar <div>o cualquier otro elemento a nivel de bloque dentro de la <p>etiqueta? Me refiero a la DTD transicional HTML4.
Si no es así, ¿está bien usarlo en <span style="display: block">su lugar?
Sintácticamente, a divdentro de a pno es válido en todos los estándares de HTML. Además, cuando se utiliza un analizador HTML conforme, es imposible colocar un <div>elemento dentro de a <p>en el DOM porque la <div>etiqueta de apertura cerrará automáticamente el <p>elemento.
Semánticamente, la elección correcta depende del contenido que esté marcando. Deberá mostrar al menos un párrafo completo de muestra y posiblemente el contenido que lo rodea para asegurarse de proporcionar suficiente información para determinar el marcado semántico correcto.
Sin embargo, dado que ambos <div>y <span>son libres de semántica, y que CSS de ninguna manera puede cambiar eso, si está seguro de que el contenido de la <p>etiqueta realmente forma un párrafo, y eso <span style="display: block">le brinda el efecto de presentación que está buscando, entonces eso es HTML válido y sería una solución totalmente apropiada.
No, un elemento de párrafo no puede contener otros elementos de bloque.
Referencia
Una etiqueta de párrafo está destinada a un bloque de texto. Si sus elementos son parte del texto (y no elementos de bloque), sería semánticamente correcto; de lo contrario, no. Una etiqueta span display:blocksigue siendo un elemento de bloque.
Es sintácticamente incorrecto, como puede comprobar usted mismo utilizando el validador de marcado W3C .
Semántica y prácticamente diría que está "bien" en el sentido de que a) es muy natural, b) todos los navegadores lo manejan correctamente (de hecho, este es uno de los problemas más fáciles a los que se enfrentan a diario).
Si su HTML es producido por la entrada del usuario (por ejemplo, un widget de editor HTML mediante el cual los visitantes pueden dejar comentarios), entonces yo diría que simplemente déjelo así, incluso si es "incorrecto".
De lo contrario, podrías cambiar un poco el marcado. Personalmente iría con
<div class="para">
<div>Some content</div>
</div>
y dar .paramárgenes apropiados con CSS.
FWIW: Tenía un párrafo entre corchetes por etiquetas de párrafo. Dentro de eso puse un div con display:inline en el div. Pero aún así trató el div como un elemento de bloque y cerró el párrafo, creando una nueva línea con un espacio entre párrafos.
Parece que cualquier elemento de bloque dentro de las etiquetas de párrafo obliga al párrafo a cerrarse incluso si el elemento de bloque se muestra en línea en su CSS.
