display Description:
The display property defines the way the element should show up in the window.
display in CSS Versions:
display Syntax:
display: inline | block | list-item | run-in | inline-block | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit
- inline
The element opens a new inline box on the same line as the previous content, and behaves as an inline element. - block
The element opens a new box, and behaves as a block-level element.
- list-item
The element is opened similarly to block, but has a list marker added to it. - run-in
Creates either block or inline boxes, depending on context. Properties apply to run-in boxes based on their final status (inline-level or block-level). - inline-block
The element is created as a block box, but is placed inline, similar to a replaced element.
- table, inline-table, table-row-group, table-column, table-column-group, table-header-group, table-footer-group, table-row, table-cell, and table-caption
These cause the element to behave like the corresponding table element. - none
The element should not show up on the page, including all child elements and the box. - inherit
The element should have the same display setting as the parent.
display Initial Value:
inline
display Applies To
All elements.
display Inheritance
This property is not inherited.
display Browser Support:
display Examples:
turn off the display of the element
<p style="display: none;">
This paragraph will not display on the page.
</p>
display Special Notes:
- In CSS1 user-agents may ignore the display value and use the user-agent's default values.
- Changing the display to none is useful with JavaScript to turn it back on or with print style sheets to only print what you need to print.
