header Element: Test And Resultsmain Element: Test And Resultsfooter Element: Test And Resultsnav Element: Test And Resultssection Element: Test And Resultsarticle Element: Test And Resultsaside Element: Test And ResultsIE9+, ED12+, FF1.5+, SF3.1+, CH2+, and OP8+ style; 1.) unknown HTML elements as type selectors, and 2.) unknown HTML elements that are classed. To demonstrate, consider, for example, the following:
abc, .classed, span, div {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
Unknown <code>abc</code> element as type selector: <abc>test text</abc> <p>---</p> Unknown <code>xyz</code> element classed: <xyz class="classed">test text</xyz> <p>---</p> Known <code>span</code> element as type selector: <span>test text</span> <p>---</p> Known <code>div</code> element as type selector: <div>test text</div>
abc element as type selector: ---
Unknownxyz element classed: ---
Knownspan element as type selector: test text
---
Knowndiv element as type selector: Web browser support for styling the unknown abc element as type selector and the user agent styles styling it as an inline element (i.e., styling it like the span element, not the div element, as type selector): IE9+, ED12+, FF1.5+, SF3.1+, CH2+, OP8+
Web browser support for styling the unknown xyz element classed and the user agent styles styling it as an inline element (i.e., styling it like the span element, not the div element, as type selector): IE9+, ED12+, FF1.5+, SF3.1+, CH2+, OP8+
Web browser no support for styling the unknown abc element as type selector: IE6 - 8, OP7.50 - 7.54u2.
Web browser no support for styling the unknown xyz element classed: IE6 - 8, OP7.50 - 7.54u2.
That web browsers style unknown elements as type selectors as inline elements makes it difficult to determine if a web browser's support
for an element is intentional as a known element, or unintentional as an unknown element.
element {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <element>test text</element> after
If test text looks like the following, then the web browser supports element and the user agent styles style it as a block-level element:
If test text looks like the following, then the web browser supports element (as a known or unknown element) and the user agent styles style it as an inline element:
If test text looks like the following, then the web browser does not support element:
before test text after
header Element: Test And Results
header {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <header>test text</header> after
Web browser support for the new HTML5 semantic header element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH5+, OP11.10+.
Web browser support for the new HTML5 semantic header element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 4, OP8 - 11.01.
Web browser no support for the new HTML5 semantic header element: IE6 - 8, OP7.50 - 7.54u2.
main Element: Test And Results
main {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <main>test text</main> after
Web browser support for the new HTML5 semantic main element and the user agent styles style it as a block-level element: ED12+, FF21+, SF?, CH26+, OP15+.
Web browser support for the new HTML5 semantic main element (as a known or unknown element) and the user agent styles style it as an inline element: IE9+, FF1.5 - 20, SF3.1 - 5.1.7, CH2 - 25, OP8 - 12.17.
Web browser no support for the new HTML5 semantic main element: IE6 - 8, OP7.50 - 7.54u2.
footer Element: Test And Results
footer {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <footer>test text</footer> after
Web browser support for the new HTML5 semantic footer element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH5+, OP11.10+.
Web browser support for the new HTML5 semantic footer element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 4, OP8 - 11.01.
Web browser no support for the new HTML5 semantic footer element: IE6 - 8, OP7.50 - 7.54u2.
nav Element: Test And Results
nav {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <nav>test text</nav> after
Web browser support for the new HTML5 semantic nav element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH4+, OP11.10+.
Web browser support for the new HTML5 semantic nav element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 3, OP8 - 11.01.
Web browser no support for the new HTML5 semantic nav element: IE6 - 8, OP7.50 - 7.54u2.
section Element: Test And Results
section {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <section>test text</section> after
Web browser support for the new HTML5 semantic section element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH5+, OP11.10+.
Web browser support for the new HTML5 semantic section element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 4, OP8 - 11.01.
Web browser no support for the new HTML5 semantic section element: IE6 - 8, OP7.50 - 7.54u2.
article Element: Test And Results
article {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <article>test text</article> after
Web browser support for the new HTML5 semantic article element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH5+, OP11.10+.
Web browser support for the new HTML5 semantic article element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 4, OP8 - 11.01.
Web browser no support for the new HTML5 semantic article element: IE6 - 8, OP7.50 - 7.54u2.
aside Element: Test And Results
aside {
width: 200px;
height: 50px;
background-color: limegreen;
color: white;
border: 2px solid blue;
}
before <aside>test text</aside> after
Web browser support for the new HTML5 semantic aside element and the user agent styles style it as a block-level element: IE9+, ED12+, FF4+, SF5+, CH5+, OP11.10+.
Web browser support for the new HTML5 semantic aside element (as a known or unknown element) and the user agent styles style it as an inline element: FF1.5 - 3.6.28, SF3.1 - 4.0.5, CH2 - 4, OP8 - 11.01.
Web browser no support for the new HTML5 semantic aside element: IE6 - 8, OP7.50 - 7.54u2.
Last reviewed/updated: 26 Oct 2016 | Published: 28 Oct 2015 | Status: Active