Display types

There are a few display types in CSS whose definition and behaviors are the foundation of frontend developers. The most known and basic display values are as follows:

  • Inline
  • Block
  • Inline-block
  • Table/table-cell
  • Flex (this will be described further in this book)

Block elements

Block elements always start from a new line. The most important properties of block elements are width and height, which can be changed from CSS code. For better understanding, let's check the following screenshot:

Block elements

It is easy to see that all the block elements are taking as much width as they can.

The mainly used HTML block-level elements are as follows:

  • address
  • article

Get Professional CSS3 now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.

Start your free trial