What is a Div?

A <div> (division/section), is a block-level HTML element that can be used to add structure/group content.

For example, a webpage might include: a navigation menu, article and advertising.
In the HTML code, the three types of content might be separated, by placing each in its own <div>.

<div id="navMain">
<h4>Main menu</h4>
...
</div>

<div id=”contentMain”>
<h1>Article title</h1>
<p>Introduction…</p>
…
</div>

<div id="contentAdvertising">
<h4>Advertisers links</h4>
...
</div>

Using the Cascading Stylesheets (CSS) presentational language, a <div> can also be styled.

For example, <div>s are commonly used to create webpage layouts or grids. CSS is used to control the visual qualities of each <div>, including its: height and width, position, background colour and borders.

div-i-tis

Div-i-tis is an informal term that is used to describe webpage code where the <div> element has been used excessively, unnecessarily or inappropriately.

• The use of <div>s to create presentational effects, such as rounded corners, can quickly lead to complex code.
  To create a visual effect may require the webpage author to use a number of nested <div>s. A more-experienced web designer might use a different technique that requires fewer <div>s to create the same effect.

• A web designer might add additional <div>s that are redundant (in terms of the final design), but that allow for future revision to the design. In some cases, redundant <div>s are required to account for variations in that way that different web browsers interpret the CSS language.

• Less-experienced webpage authors will often use a <div> in place of a more semantically-appropriate HTML element. For example, they might use a <div> and CSS to style text to look like a heading, rather than using an HTML heading element (<h1>, <h2>,<h3>, etc.).