Why are inline div behaving this way inside p

Question

In the linked example, I have a text and a paragraph which each contain span and div elements. Although all the div elements have the

Answer 1

div inside p is invalid markup. When the browser encounters the div element it auto-closes the p tag and starts the new div.