Current Assignment(s)

A5: Multimedia
Due: Recommended by Monday, 5.28

The <div> Element

Up till this point, all elements that we have looked at have had specific structural or semantic purposes (i.e. defining a paragraph, heading, emphasized text, or including images). There are however, 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. To describe the example images you've been seeing, these elements work much like building blocks - separate bricks that come together to create the structure of the page.

This element is heavily used by developers 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 also serves as 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