Test4: Unterschied zwischen den Versionen
Aus exmediawiki
Theo (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Theo (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 10: | Zeile 10: | ||
<div style="display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin-bottom: 50px;"> | <div style="display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; margin-bottom: 50px;"> | ||
<!-- First collapsible item (Holz) --> | <!-- First collapsible item (Holz) --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | ||
<div class="mw-collapsible-toggle" style="width: 100%; box-sizing: border-box;"> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | <div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | ||
<h3 style="color: white; margin: 0;">Holz</h3> | |||
</div> | </div> | ||
<span class="down"></span> | <span class="down"></span> | ||
</div> | |||
<div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0.5em; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 0.5em;"> | |||
<div style=" | <!-- Black boxes inside expandable content --> | ||
< | <div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | ||
<h4 style="margin: 0;">Sub-Holz 1</h4> | |||
</div> | |||
</div> | <div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | ||
<h4 style="margin: 0;">Sub-Holz 2</h4> | |||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
<h4 style="margin: 0;">Sub-Holz 3</h4> | |||
</div> | |||
</div> | |||
</div> | |||
<!-- Second collapsible item (Metalle) --> | <!-- Second collapsible item (Metalle) --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | ||
<div class="mw-collapsible-toggle" style="width: 100%; box-sizing: border-box;"> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | <div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | ||
<h3 style="color: white; margin: 0;">Metalle</h3> | |||
</div> | </div> | ||
<span class="down"></span> | <span class="down"></span> | ||
</div> | |||
<div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0.5em; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 0.5em;"> | |||
<div style=" | <div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | ||
< | <h4 style="margin: 0;">Sub-Metall 1</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
</div> | <h4 style="margin: 0;">Sub-Metall 2</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
<h4 style="margin: 0;">Sub-Metall 3</h4> | |||
</div> | |||
</div> | |||
</div> | |||
<!-- Third collapsible item (Gestein) --> | <!-- Third collapsible item (Gestein) --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | ||
<div class="mw-collapsible-toggle" style="width: 100%; box-sizing: border-box;"> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | <div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | ||
<h3 style="color: white; margin: 0;">Gestein</h3> | |||
</div> | </div> | ||
<span class="down"></span> | <span class="down"></span> | ||
</div> | |||
<div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0.5em; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 0.5em;"> | |||
<div style=" | <div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | ||
< | <h4 style="margin: 0;">Sub-Gestein 1</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
</div> | <h4 style="margin: 0;">Sub-Gestein 2</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
<h4 style="margin: 0;">Sub-Gestein 3</h4> | |||
</div> | |||
</div> | |||
</div> | |||
<!-- Fourth collapsible item (Tierische Werkstoffe) --> | <!-- Fourth collapsible item (Tierische Werkstoffe) --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 0.1em); position: relative; box-sizing: border-box;"> | ||
<div class="mw-collapsible-toggle" style="width: 100%; box-sizing: border-box;"> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | <div style="background-color: black; border-radius: 9999px; padding: 0.5em; width: 100%; text-align: center; margin-bottom: 1em; box-sizing: border-box;"> | ||
<h3 style="color: white; margin: 0;">Tierische Werkstoffe</h3> | |||
</div> | </div> | ||
<span class="down"></span> | <span class="down"></span> | ||
</div> | |||
<div class="mw-collapsible-content" style="width: 100%; margin: 0; padding: 0.5em; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 0.5em;"> | |||
<div style=" | <div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | ||
< | <h4 style="margin: 0;">Sub-Tierisch 1</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
</div> | <h4 style="margin: 0;">Sub-Tierisch 2</h4> | ||
</div> | |||
<div style="background-color: black; border-radius: 9999px; padding: 0.5em 1em; color: white; text-align: center;"> | |||
<h4 style="margin: 0;">Sub-Tierisch 3</h4> | |||
</div> | |||
</div> | |||
</div> | |||
</div> | </div> | ||
Version vom 20. Mai 2025, 23:30 Uhr
Materials