Das Element wird vollständig entfernt, als ob es gar nicht im HTML-Code enthalten wäre.

Das Element wird in ein inline-Element umgewandelt: Es verhält sich wie einfacher Text.

Jede height und width hat keine Auswirkung.

Das Element wird in ein Block-Element umgewandelt: Es beginnt in einer neuen Zeile und nimmt die gesamte Breite ein.

Das Element hat die gleichen Eigenschaften wie ein inline und ein Block Element:

• inline weil sich das Element wie einfacher Text verhält und sich in einen Textblock einfügt
• Block, weil man height und width Werte anwenden kann

Zum Beispiel hat dieses Element:

.element{
  height: 3em;
  width: 60px;
}

Das Element verhält sich wie ein Listenelement: <li>. Der einzige Unterschied zu Block ist, dass ein Listenelement einen Bullet Point hat.

Das Element verhält sich wie eine Tabelle: <table>.

Sein Inhalt und seine untergeordneten Elemente verhalten sich wie Tabellenzellen.

Das Element verhält sich wie eine Tabellenzelle: <td> oder <th>.

Sein Inhalt und seine untergeordneten Elemente verhalten sich wie Tabellenzellen.

Das Element verhält sich wie eine Tabellenzeile: <tr>.

Sein Inhalt und seine untergeordneten Elemente verhalten sich wie Tabellenzellen.

Das Element wird in einen Flexbox-Container verwandelt. Für sich genommen verhält es sich wie ein Blockelement.

Seine untergeordneten Elemente werden in Flexbox-Elemente umgewandelt.

Das Element hat die gleichen Eigenschaften wie ein inline und ein flexbox Element:

• inline weil das Element sich wie einfacher Text verhält und sich in einen Textblock einfügt
• flexbox, weil sein Kindelement in Flexbox-Elemente umgewandelt wird

Zum Beispiel hat dieses Element:

.element{
  height: 3em;
  width: 120px;
}

Das Element wird in einen Raster-Container umgewandelt. Für sich genommen verhält es sich wie ein Blockelement.

Seine untergeordneten Elemente werden in Gitterelemente umgewandelt.

Das Element hat die gleichen Eigenschaften wie ein inline und ein grid Element:

• inline weil das Element sich wie einfacher Text verhält und sich in einen Textblock einfügt
• Raster, weil sein Kindelement in Flexbox-Elemente umgewandelt wird

Zum Beispiel, dieses Element hat:

.element{
  height: 3em;
  width: 120px;
}