What is the CSS `display` property and can you give a few examples of its use?
Importance
High
Quiz Topics
CSS
The various values for the display property: none, block, inline, inline-block, flex, grid, table, table-row, table-cell, list-item.
display Value | Description |
|---|---|
none | Does not display an element (the element no longer affects the layout of the document). All child element are also no longer displayed. The document is rendered as if the element did not exist in the document tree. |
block | The element consumes the whole line in the block direction (which is usually horizontal). |
inline | Elements can be laid out beside each other. |
inline-block | Similar to inline, but allows some block properties like setting width and height. |
table | Behaves like the <table> element. |
table-row | Behaves like the <tr> element. |
table-cell | Behaves like the <td> element. |
list-item | Behaves like a <li> element which allows it to define list-style-type and list-style-position. |