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.
The <div>...</div> element offers developers a block-level element to group other elements together.
This element is heavily used by developers to increase structural clarity and identify element groups. This in turn, increases readability, which is always desired.
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.
Example Usage
<div class="page-header" id="page-header" style="display:inline;">
<img src="../imgs/buff_icon_left.png" alt="Buffalo Icon" title="Buffalo Icon"
width="75" height="75" style="display:inline;">
<h1 class="page-title" style="display:inline">American Sport Descriptions</h1>
<img src="../imgs/buff_icon_right.png" alt="Buffalo Icon" title="Buffalo Icon"
width="75" height="75" style="display:inline;">
</div>
<div class="content-block" id="football-block">
<h2 class="card-label">Football</h2>
<p class="card-description" id="football-description">
Football is an American sport of strategy and skill. American football
evolved in the United States, originating from the sports of
association football and rugby football. The first game of American
football was played on November 6, 1869, between two college teams,
Rutgers and Princeton, under rules based on the association football
rules of the time.
</p>
</div>
<div class="content-block" id="stock-car-block">
<h2 class="card-label">Stock-Car Racing</h2>
<p class="card-description" id="stock-car-description">
Stock car racing is a form of automobile racing found mainly and most
prominently in the United States. Traditionally, races are run on oval
tracks measuring approximately 0.25 to 2.66 miles. The world's largest
governing body for stock car racing is the American NASCAR, and its
Monster Energy NASCAR Cup Series is the premier top level series of
professional stock car racing. Top level races typically range between
200 to 600 miles in length.
</p>
</div>
American Sport Descriptions
Football
Football is an American sport of strategy and skill. American football evolved in the United States, originating from the sports of association football and rugby football. The first game of American football was played on November 6, 1869, between two college teams, Rutgers and Princeton, under rules based on the association football rules of the time.
Stock-Car Racing
Stock car racing is a form of automobile racing found mainly and most prominently in the United States. Traditionally, races are run on oval tracks measuring approximately 0.25 to 2.66 miles. The world's largest governing body for stock car racing is the American NASCAR, and its Monster Energy NASCAR Cup Series is the premier top level series of professional stock car racing. Top level races typically range between 200 to 600 miles in length.
Block Level Elements
Notice in the above code that the use of the <div> element creates blocks that appear on a new line.
Block elements appear on their own block on a new line. Other examples of block elements include;
- Headings
<h1>-<h6> - Paragraphs
<p> - Images
<img>
Each of these, unless told otherwise through styling, appears on a new line in HTML pages.