MediaWiki:Common.css: Unterschied zwischen den Versionen
Aus www.erkenfara.com
Bero (Diskussion | Beiträge) KKeine Bearbeitungszusammenfassung |
Bero (Diskussion | Beiträge) KKeine Bearbeitungszusammenfassung |
||
| Zeile 2: | Zeile 2: | ||
/* Extra small devices (xs): Mobile first */ | /* Extra small devices (xs): Mobile first */ | ||
.columnized { | |||
column-count: 1; | |||
} | |||
.flex-container { | .flex-container { | ||
| Zeile 43: | Zeile 47: | ||
/* Large devices (lg) */ | /* Large devices (lg) */ | ||
@media (min-width: 992px) { | @media (min-width: 992px) { | ||
.columnized { | |||
column-count: 2; | |||
} | |||
.flex-container .flex-item { | .flex-container .flex-item { | ||
width: 49%; | width: 49%; | ||
| Zeile 50: | Zeile 57: | ||
/* Extra large devices (xl) */ | /* Extra large devices (xl) */ | ||
@media (min-width: 1200px) { | @media (min-width: 1200px) { | ||
.columnized { | |||
column-count: 3; | |||
} | |||
.flex-container .flex-item { | .flex-container .flex-item { | ||
width: 33%; | width: 33%; | ||
} | } | ||
} | } | ||
Version vom 26. Juni 2025, 11:24 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
/* Extra small devices (xs): Mobile first */
.columnized {
column-count: 1;
}
.flex-container {
align-items: stretch;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.flex-container .flex-item {
width: 100%;
}
table.wikitable.infobox-charakter,
table.wikitable.infobox-gott,
table.wikitable.infobox-ort,
table.wikitable.infobox-reich,
table.wikitable.infobox-tier,
table.wikitable.infobox-treffen,
table.wikitable.infobox-treffen-ausgefallen
{
float: right;
margin-left: 2em;
max-width: 100%;
width: 400px;
}
.flex-container .flex-item table.wikitable.infobox-treffen,
.flex-container .flex-item table.wikitable.infobox-treffen-ausgefallen {
width: 100%;
}
/* Small devices (sm) */
@media (min-width: 576px) {
}
/* Medium devices (md) */
@media (min-width: 768px) {
}
/* Large devices (lg) */
@media (min-width: 992px) {
.columnized {
column-count: 2;
}
.flex-container .flex-item {
width: 49%;
}
}
/* Extra large devices (xl) */
@media (min-width: 1200px) {
.columnized {
column-count: 3;
}
.flex-container .flex-item {
width: 33%;
}
}
