Code
You are here: Home > HTML Reference > Elements > <section> element
Usage
First introduced in XHTML 2.0, the section element is inconsistently supported in major browsers. In theory, it should be simple to use <section> instead of a generic block-level element like <div class=section>. For example:
```
Welcome to Initech
This is our home page.
```
And you would expect the DOM to look something like this (omitting text nodes for carriage returns):
section
|
+--h1 (child of section)
| |
| +--text node "Welcome to Initech"
|
+--p (child of section, sibling of h1)
|
+--text node "This is our "
|
+--span
| |
| +--text node "home page"
|
+--text node "."
Unfortunately, IE does not natively recognize the section element, so the elements that you would expect to be children of the section element are actually siblings, and the section element appears in the DOM as an empty node.
section (no children)
h1 (sibling of section)
|
+--text node "Welcome to Initech"
p (sibling of h1)
|
+--text node "This is our "
|
+--span
| |
| +--text node "home page"
|
+--text node "."
Attributes
- common attributes
Browser compatibility
Compatibility table legend
| Test | IE8 | IE7 | IE6 | FF3 | FF2 | Saf3 | Op9 | Chrome | |:---------|:--------|:--------|:--------|:--------|:--------|:---------|:--------|:-----------| | appears in DOM | Y | Y | Y | Y | Y | Y | Y | Y | | applies style | N | Y | Y | Y | Y | Y | Y | Y |