Inline vs. Block Elements

Given that the role of HTML is markup, i.e. providing structure and formatting to text, HTML elements can broadly be categorized into two categories depending on how they affect the flow of text - inline and block.

Inline elements referred to elements that maintained the flow of text, i.e. the bring attention to (<b>) element used in a paragraph of text, would bold the text without breaking the flow:

<p>The quick brown <b>fox</b> lept over the log</p>

The quick brown fox lept over the log

In contrast, block elements break the flow of text. For example, the <blockquote> element used to inject a quote into the middle of the same paragraph:

<p>The quick brown fox <blockquote>What does the fox say? - YLVIS</blockquote> lept over the log</p>

The quick brown fox

What does the fox say? - YLVIS
lept over the log

While HTML elements default to either block or inline behavior, this can be changed with the CSS display property.