Test3: Unterschied zwischen den Versionen
Aus exmediawiki
Theo (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Theo (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 2: | Zeile 2: | ||
<!-- First collapsible item --> | <!-- First collapsible item --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em; position: relative;"> | ||
<div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | <div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | ||
<span class="down"> | <span class="down"> | ||
| Zeile 9: | Zeile 9: | ||
</span> | </span> | ||
</div> | </div> | ||
<div class="mw-collapsible-content" style="position: | <div class="mw-collapsible-content" style="position: absolute; width: 400%; left: 0; background-color: white; padding: 10px; border: 1px solid #ddd; margin-top: 1em; box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 10;"> | ||
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | <div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | ||
<!-- Image Block Start --> | <!-- Image Block Start --> | ||
| Zeile 37: | Zeile 37: | ||
<!-- Second collapsible item --> | <!-- Second collapsible item --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em; position: relative;"> | ||
<div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | <div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | ||
<span class="down"> | <span class="down"> | ||
| Zeile 44: | Zeile 44: | ||
</span> | </span> | ||
</div> | </div> | ||
<div class="mw-collapsible-content" style="position: | <div class="mw-collapsible-content" style="position: absolute; width: 400%; right: 0; background-color: white; padding: 10px; border: 1px solid #ddd; margin-top: 1em; box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 10;"> | ||
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | <div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | ||
<!-- Image Block Start --> | <!-- Image Block Start --> | ||
| Zeile 64: | Zeile 64: | ||
<!-- Third collapsible item --> | <!-- Third collapsible item --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em; position: relative;"> | ||
<div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | <div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | ||
<span class="down"> | <span class="down"> | ||
| Zeile 71: | Zeile 71: | ||
</span> | </span> | ||
</div> | </div> | ||
<div class="mw-collapsible-content" style="position: | <div class="mw-collapsible-content" style="position: absolute; width: 400%; right: 25%; background-color: white; padding: 10px; border: 1px solid #ddd; margin-top: 1em; box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 10;"> | ||
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | <div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | ||
<!-- Image Block Start --> | <!-- Image Block Start --> | ||
| Zeile 87: | Zeile 87: | ||
<!-- Fourth collapsible item --> | <!-- Fourth collapsible item --> | ||
<div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em;"> | <div class="mw-collapsible mw-collapsed" style="flex: 0 0 calc(25% - 1em); margin-bottom: 1em; position: relative;"> | ||
<div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | <div class="mw-collapsible-toggle" style="float: none; text-align: center;"> | ||
<span class="down"> | <span class="down"> | ||
| Zeile 94: | Zeile 94: | ||
</span> | </span> | ||
</div> | </div> | ||
<div class="mw-collapsible-content" style="position: | <div class="mw-collapsible-content" style="position: absolute; width: 400%; right: 0; background-color: white; padding: 10px; border: 1px solid #ddd; margin-top: 1em; box-shadow: 0 2px 5px rgba(0,0,0,0.1); z-index: 10;"> | ||
<div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | <div style="display: flex; flex-wrap: wrap; gap: 1em; justify-content: flex-start;"> | ||
<!-- Image Block Start --> | <!-- Image Block Start --> | ||
| Zeile 111: | Zeile 111: | ||
</div> | </div> | ||
<!-- | <!-- This div creates space based on content height when expanded --> | ||
<div style="clear: both; width: 100%; margin-top: 20px;"></div> | <div class="spacer" style="clear: both; width: 100%; height: 300px; margin-top: 20px;"></div> | ||
