Loading...

Display properties

Set the type of box used to render an element.

Display

Options and behavior:

  • Inline - Set the element to display inline 
  • Inline-block - Set the element to display inline as a block. Inline-block elements can be given a width and height
  • Block- Set the element to display as a block. Block elements can be given a width and a height
  • None- Turn off the display of the element and all of its children
  • Table- Set the element to behave like a table element
  • Table-cell - Set the element to behave like a table-cell <td> element
  • Flex - Set the element to a flex container
  • Inline-flex - Sets the element to an inline flex container

See the diagram below to help you understand the affects of these properties.

Visibility

Options and behavior:

  • Visible - Set the element to be visible on the page
  • Hidden - Hide the element so that it won't appear
  • Collapse - Removes a row or column in a table. This is only relevant for table elements. If selected on a non-table element, they will instead be hidden.

Overflow

Options and behavior:

  • Visible - Set the element to be visible on the page
  • Hidden - Hide the element so that it won't appear
  • Scroll - Overflow content is hidden, but a scroll bar is added to view it
  • Auto - Adds a scroll bar to view overflow content by default.

X-overflow

Set what happens to the overflow content of an element to its left and right.

Options and behavior:

  • Visible - Overflow content is visible outside the content box
  • Hidden - Overflow content outside the content box is hidden
  • Scroll - Overflow content is hidden, but a scroll bar is added to view it
  • Auto - Adds a scroll bar to view overflow content by default.

Y-overflow

Set what happens to the overflow content of an element at its top and bottom.

Options and behavior:

  • Visible - Overflow content is visible outside the content box
  • Hidden - Overflow content outside the content box is hidden
  • Scroll - Overflow content is hidden, but a scroll bar is added to view it
  • Auto - Adds a scroll bar to view overflow content by default.

Did not find what you were looking for?

If this content did not answer your questions, try searching or contacting our support team for further assistance.

Back to Section navigation