Every browser has a master list of HTML elements that it supports. For example, Mozilla Firefox’s list is stored in nsElementTable.cpp. Elements not in this list are treated as “unknown elements.” There are two fundamental questions regarding unknown elements:
spacing on the top and bottom,
<blockquote> is indented with a left
displayed in a larger font.
Mozilla’s nsElementTable.cpp includes information
about what kinds of other elements each element can contain. If you
include markup like
<p><p>, the second paragraph
element implicitly closes the first one, so the elements end up as
siblings, not parent and child. But if you write
span does not close the paragraph, because
Firefox knows that
<p> is a
block element that can contain the inline element
<span>. So the
<span> ends up as a child of the
<p> in the DOM.
Different browsers answer these questions in different ways. (Shocking, I know.) Of the major browsers, Microsoft Internet Explorer’s answer to both questions is the most problematic.
The first question should be relatively simple to answer: don’t give any special styling to unknown elements. Just let them inherit whatever CSS properties are in effect wherever they appear on the page, and let the page author specify all styling with CSS. Unfortunately, Internet Explorer (prior to Version 9) ...