The div tag is used to split and separate content in HTML. The div container is only re­com­men­ded when other elements cannot be used, as the div container does not have its own semantic features.

Cheap domain names – buy yours now
  • Free website pro­tec­tion with SSL Wildcard included
  • Free private re­gis­tra­tion for greater privacy
  • Free Domain Connect for easy DNS setup

What is a div container and what is it used for?

A div container, which derives its name from the word `division´, serves primarily as a container for other HTML elements. Although it is possible to position groups and sections, div does not have its own semantic features in HTML. Its primary task is therefore to create and delimit areas which can be formatted with CSS. The div container has no influence on a website’s layout or content.

This high­lights why the div tag in HTML no longer plays a large role. The div container was used quite often in earlier versions, however its use was massively re­stric­ted with the in­tro­duc­tion of HTML5 and HTML 5.1. It is re­com­men­ded to find al­tern­at­ive se­mantic­ally suitable solutions before using the HTML div tag. The div container should only be used for the layout when no other element can be used, such as the article, aside, header, main, nav or section elements. The div container is inserted as a block-level element in a one line break before and after it.

How is div used in HTML?

The div tag in HTML is used to format HTML elements with CSS which belong together visually, bundle different HTML blocks and position them clearly, and animate HTML, CSS, and JavaS­cript content. The following example il­lus­trates how a div container is con­struc­ted without at­trib­utes:

<div>
<h2>example list</h2>
<ul>
<li>first item on the list</li>
<li>second item on the list</li>
<li>third item on the list</li>
<li>fourth item on the list</li>
</ul>
</div>

Almost any flowing content can be placed within the div container in principle. The HTML div tag has no effect on the content display, but it does section off the content.

Which at­trib­utes does the div container support?

The div tag in HTML only supports global at­trib­utes. align is an exception which is no longer allowed for div con­tain­ers since the in­tro­duc­tion of HTML5. class and id are the most used HTML at­trib­utes for div. Below are two examples of div con­tain­ers with at­trib­utes:

<div class="example">
<h2>example of a headline</h2>.
<p>you can insert a sample text here, which is sectioned off by the div container.</p>
</div>

The id attribute can also be used with a div container:

<div id="example">
<ul>
<li><a href="index.html" title="To Home Page">Home Page</a></li>
<li><a href="contact.html" title="Write to us">Contact</a></li>
<li><a href="about.html" title="About Us">About</a></li>
</ul>
</div>

Con­clu­sion: The HTML div tag is basically a thing of the past

There are several reasons why div doesn’t play a big role in HTML anymore. It is not solely due the problems that come with a div container, but rather the fact that semantic HTML tags structure the data more ef­fi­ciently, which makes main­ten­ance easier. Cor­rec­tions to a document can also be made faster by using other objects such as header, footer, article or section. It is good to know div If you are learning HTML or learning CSS. However, it may be more be­ne­fi­cial to use more se­mantic­ally ap­pro­pri­ate elements.

Tip

Do you already have a vision of your website? Cultivate your pro­fes­sion­al online presence with the Website Builder from IONOS. Our know­ledge­able experts will be there every step of the way to assist you if necessary.

Go to Main Menu