Extraño error de html con párrafo

Entonces tengo este código:

<p id="item_1">
    <div class="background displayInline deleteItemFromCart" title="Delete item"></div>
    some text
</p>

¿Simple verdad? ahora, ¿qué pasaría si viera la fuente en Chrome herramientas de desarrollo:

enter image description here

Y como puedes ver por alguna razón <p> ya no contiene nada.

Si intentara eliminar el texto div, volvería a estar en <p> etiquetar de nuevo, así que mi mejor suposición sería que <p> no puede contener ninguno o solo elementos div?

EDITAR Bueno, era una pregunta estúpida, de todos modos, ahora que lo pienso, podría haber usado <ul> en lugar de <p> si iba a construir una lista de cosas... De todos modos, gracias a todos por su ayuda.

preguntado el 08 de septiembre de 12 a las 09:09

4 Respuestas

Tienes razón, <p> solo puede contener elementos en línea y texto, pero <div> es un elemento de bloque.

Los elementos en línea son: a abbr acronym applet b basefont bdo big br button cite code del dfn em font i img ins input iframe kbd label map object q samp script select small span strong sub sup textarea tt var

Respondido el 08 de Septiembre de 12 a las 09:09

Esto no es extraño. Es simplemente un marcado incorrecto :)

<p id="item_1">
    <span style="display:block" class="background displayInline deleteItemFromCart" title="Delete item"></span>
    some text
</p>

Pero si bien los estilos en línea son malos, debe poner algo como esto en su archivo master.css.

p span {display:block}
// Or
#item_1 span {display:block}

Respondido el 08 de Septiembre de 12 a las 09:09

La p etiqueta no pueden contienen elementos a nivel de bloque, incluido él mismo. Fuente: http://www.w3.org/TR/html401/struct/text.html#h-9.3.1

Respondido el 08 de Septiembre de 12 a las 09:09

P solo puede contener un elemento en línea.

Consulte este enlace para obtener una discusión rápida sobre el contenido de flujo/elemento en línea.

Debería ol / ul estar dentro ¿o afuera?

contestado el 23 de mayo de 17 a las 12:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.