div (HTML attribute)
Description
The div
is a generic block-level element. It doesn’t convey any meaning about its contents (unlike a p
element that signifies a paragraph, or an h1
or h2
element that would indicate a level 1 or level 2 heading, respectively); as such, it’s easy to customize it to your needs. The div
element is currently the most common method for identifying the structural sections of a document and for laying out a web page using CSS.
Some developers perceive similarities between the p
and the div
elements, seeing them as being interchangeable, but this isn’t the case. The p
element offers more semantic information (“this is a paragraph of text, a small collection of thoughts that are grouped together; the next paragraph outlines some different thoughts”), while the
div
element can be used to group almost any elements together. Indeed, it can contain almost any other element, unlike p
, which can only contain inline elements.
Example
The HTML below shows two div
s being used in conjunction with id
attributes to identify different sections of a web page:
<div id="main_navigation"> ⋮ </div> <div id="body_content"> <h1>Page heading</h1> <p>Body content</p> </div>
Use This For …
The div
is an “anything-goes” element—it can contain any inline or block-level
elements you choose, so it has no typical content.
Compatibility
Internet Explorer | Firefox | Safari | Opera | Chrome | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
5.5 | 6.0 | 7.0 | 8.0 | 1.0 | 1.5 | 2.0 | 3.0 | 3.5 | 1.3 | 2.0 | 3.1 | 4.0 | 9.2 | 9.5 | 10.0 | 2.0 |
Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full |
This element has no compatibility issues. All the browsers listed support the
div
element.