CSS display Property
ExampleLet a paragraph generate an inline box:
Try it yourself » |
Definition and Usage
The display property specifies the type of box an element should generate.
Default value: | inline |
---|---|
Inherited: | no |
Version: | CSS1 |
JavaScript syntax: | object.style.display="inline" |
Browser Support
The display property is supported in all major browsers.
Note: Internet Explorer 8 (and higher) supports the property values "inline-table", "run-in", "table", "table-caption", "table-cell", "table-column", "table-column-group", "table-row", "table-row-group", and "inherit" only if a !DOCTYPE is specified.
Property Values
Value | Description |
---|---|
none | The element will generate no box at all |
block | The element will generate a block box (a line break before and after the element) |
inline | The element will generate an inline box (no line break before or after the element). This is default |
inline-block | The element will generate a block box, laid out as an inline box |
inline-table | The element will generate an inline box (like <table>, with no line break before or after) |
list-item | The element will generate a block box, and an inline box for the list marker |
run-in | The element will generate a block or inline box, depending on context |
table | The element will behave like a table (like <table>, with a line break before and after) |
table-caption | The element will behave like a table caption (like <caption>) |
table-cell | The element will behave like a table cell |
table-column | The element will behave like a table column |
table-column-group | The element will behave like a table column group (like <colgroup>) |
table-footer-group | The element will behave like a table footer row group |
table-header-group | The element will behave like a table header row group |
table-row | The element will behave like a table row |
table-row-group | The element will behave like a table row group |
inherit | Specifies that the value of the display property should be inherited from the parent element |
Related Pages
CSS tutorial: CSS Classification
HTML DOM reference: display property
![]() |
Try it Yourself - Examples |
Using the inherit value
This example demonstrates how to use the inherit property value.
