Flow

The flow of a web page determines the order in which elements are displayed vertically and horizontally. By default, elements are shown in the order in which they appear in the HTML document, from top to bottom. The horizontal flow typically moves from left to right; however, the flow is also reversed from right to left in languages that read from right to left.

Every element in HTML is a rectangular area that takes up a position on a line, similar to words on a lined sheet. There are two primary types of elements: block-level and inline elements.

After inspecting the example, we can conclude:

Block-level element: occupies the entire width of its container, regardless of the content size. Block elements stack on top of each other, one after another.

Inline element: occupies only as much width as its content requires. This allows inline elements to sit on the same line. If there isn't enough space on one line, they will wrap to the next line.

Note

The display property of HTML elements is predefined according to standards and conventions established by the HTML specification. These standards dictate the default rendering behavior of elements across various web browsers. You can find the specific type of any element in the reference or specification links provided: HTML Reference and HTML Specification.

Element Types

As previously mentioned, every element in the browser style sheet has a type represented by the display property, which determines its behavior. The two main types of elements are block-level and inline elements, and there are also additional types, such as inline-block elements.

Inline elements: Primarily used for styling and highlighting small parts of content, such as links, buttons, and images. They remain on the same line until the space is filled, at which point they wrap to the next line.

Block-level elements: Used to define larger content structures like headings, paragraphs, lists, and sections (e.g., headers, footers). They are visually displayed as rectangular blocks that stack vertically on top of each other.