Grouping with Divs

Up until this point, all elements we have examined have had specific structural or semantic purposes (e.g., defining a paragraph, heading, emphasizing text, or including images). However, there are elements that provide structure without necessarily implying styling or content.

stacked building blocks

The <div>...</div> element offers developers a block-level element to group other elements together.

Divs can be singular or nested within each other. Developers heavily use this element to increase structural clarity and identify element groups. This, in turn, increases readability, which is always desired.

HTML
<div id="one">
  <!-- Content -->
</div>

<div id="two">
  <!-- Different Content -->
</div>

This element is an easy way to wrap content to style via CSS. By itself, the sole styling implied by the div element is that it will start on a new line