What breaks this table layout?

What breaks this table layout?

Simple contents layout using CSS's table, table-row and table-cell divs:
<div style="display:table-cell; border:1px solid blue">
some content <!-- this line wrappend in <p> tag in next example -->
<p>some content</p>
...
</div>
two column layout with a nested table on the right
The above example but with left cell's content placed in paragraph (the
first row):
above example but <p> breaking flow of the right table-cell
As you can see, after <p> tag put in left cell the right cell is shifted
down. It doesn't matter if I use <p> or <h1> tag. Assume it does change
line-height and 1st row in the adjacent cell is aligned to it.
Can anybody explain this behaviour. How can I prevent shifting of the
adjacent cell ?