CSS display Property

CSS display property specifies the type of rendering box to use for an element.

Usages

The following table outline the usages and version history of this property.

Default value: inline
Applies to: All elements
Inherited: No
Version: CSS1
JavaScript Syntax: object.style.display = "block"

Syntax

Here is a syntax for the CSS display property

display: block | inline | inline-block | list-item | table | table-caption | table-cell |
         table-column | table-column-group | table-footer-group | table-header-group | 
         table-row | table-row-group | run-in | none | initial | inherit;

Property Values

The following table describes the values of this property.

Value Description
block The element generates a block element box
inline Default. The element generates one or more inline element boxes
inline-block The element generates a block box that is laid out, if it were an inline box
list-item The element generates a block box for the content and a separate list-item for the list marker
table The element behave like <table> element
inline-table The element behave like <table> that is laid out if it were an inline box
table-caption The element behave like <caption> element
table-column The element behave like <col> element
table-column-group The element behave like <colgroup> element
table-header-group The element behave like <thead> element
table-row-group The element behave like <tbody> element
table-footer-group The element behave like <tfoot> element
table-row The element behave like <tr> element
table-cell The element behave like <td> element
run-in The element generates a run-in box. Run-in element behave like inline or block, depending on the surrounding elements
none Specifies that turn off the display of an element
initial Sets default value of this property
inherit Inherits this property from its parent element

Examples

The example below shows to sets display property.

p.one {
  display: inline;
}
p.two {
  display: block;
}
p.three {
  display: inline-block;
}
p.four {
  display: none;
}

Run it...   »

Browser Compatibility

  • Google Chrome 4+
  • Mozilla Firefox 3+
  • Internet Explorer 8+
  • Opera 7+
  • Safari 3.1+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.