From b37787ac7f1fdd4c5ca906585ff7adca866a54eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Felix=20H=C3=A4berle?=
 <34959078+felixhaeberle@users.noreply.github.com>
Date: Sun, 24 Nov 2019 19:16:25 +0100
Subject: [PATCH] [css] add short display property descriptions (#217)

Added short display property descriptions to explain what gets generated if applying one of those display values.
---
 questions/css-questions.md | 24 ++++++++++--------------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/questions/css-questions.md b/questions/css-questions.md
index 54b3a56c7..9ad097dc7 100644
--- a/questions/css-questions.md
+++ b/questions/css-questions.md
@@ -390,20 +390,16 @@ The box model has the following rules:
 
 * `none`, `block`, `inline`, `inline-block`, `flex`, `gird`, `table`, `table-row`, `table-cell`, `list-item`.
 
-* none: Hides the element, the element is completely removed
-* block: Displays an element as a block element (like <p>). It starts on a new line, and takes up the whole width
-* inline: Displays an element as an inline element (like <span>). Any height and width properties will have no effect
-* inline-block: Displays an element as an inline-level block container. The element itself is formatted as an inline element, but you can apply height and width values
-* flex: Displays an element as a block-level flex container
-* grid: Displays an element as a block-level grid container
-* table: Let the element behave like a <table> element
-* table-row: Let the element behave like a <tr> element
-* table-cell: Let the element behave like a <td> element
-* list-item: Let the element behave like a <li> element
-
-###### References
-
-* https://www.w3schools.com/cssref/pr_class_display.asp
+| `display` | Description |
+|:--- | :--- |
+| `none` | Does not display an element (the elementv 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` |
 
 [[↑] Back to top](#css-questions)