Why appear
tag around tag?

Question

I have this:

<p>
    <img src="media/icons/info_ticket.png"></img>
    <h3>Ticket #TKMA<span><?php echo $_GET['CRy3sjzZOJyXE']; ?></span></h3>
</p>

And when I apply CSS to change the style of the img it doesn't work! So, I inspected the element and I found this:

<p>
    <img src="media/icons/info_ticket.png">
</p>
<h3>Ticket #TKMA<span>17</span></h3>
<p></p>

I don't understand why this happens.

`
` is a block-level element and should never be inside a `
`. — Marc B, Feb 15 '13 at 19:14
ok, 4 answers exactly equal, why not just upvote the first who posted? — Toping, Feb 15 '13 at 19:16
Haha, and the feeding frenzy of answers and even crazier frenzy of editing has begun! — Ryan, Feb 15 '13 at 19:18
@ryan :( thats true and sad, ppl answer as quickly as they can, and after this they make the changes to fit the question, its the "first" syndrome. — Toping, Feb 15 '13 at 19:20
@Ark Well.. upvote for all but the answer that post links to reference.. is choosen :P (don't hate me) — SoldierCorp, Feb 15 '13 at 19:22
@SoldierCorp haha, go ahead, they giv it right, they deserve it, for future reference its better. im gonna upvote too — Toping, Feb 15 '13 at 19:23
@Ark, haha.Nonetheless, mine was never modified. A simple question requires a simple, to the point explanation and that's the route I took ;). — Dennis Rongo, Feb 15 '13 at 19:39

score 16 · Accepted Answer · edited May 23 '17 at 12:16

16

Because your HTML is invalid. <p> elements can only contain phrasing content.

See List of HTML5 elements that can be nested inside P element?

edited May 23 '17 at 12:16

Community

1
1

answered Feb 15 '13 at 19:14

Matt Ball

354,903
100
647
710

2

^^ was the first to respond, and lists the most resources. – Ryan Feb 15 '13 at 19:22
Why does this validates correctly then on the validator page http://html5.validator.nu/ `
Hello worldTest
` – Gabriel Rodriguez Feb 03 '17 at 18:32

score 3 · Answer 2 · answered Feb 15 '13 at 19:14

3

The reason is because, an H element inside a <p> element isn't valid so the browser corrects it by pulling it out.

answered Feb 15 '13 at 19:14

Dennis Rongo

4,611
1
25
25

score 2 · Answer 3 · answered Feb 15 '13 at 19:14

2

Because having an <h3> inside a <p> is invalid html

The browser is doing its version of auto-correct.

answered Feb 15 '13 at 19:14

Forty-Two

7,535
2
37
54

score 2 · Answer 4 · answered Feb 15 '13 at 19:15

2

An <h3> tag is not valid inside a <p> tag. Your editor is "fixing" it by moving the header outside the paragraph, leaving only the image in the paragraph.

answered Feb 15 '13 at 19:15

Nate Hekman

6,507
27
30

Why appear tag around tag?

` is a block-level element and should never be inside a `

4 Answers4

Why appear
tag around tag?