Yukii am 21. Mai 2023 um 07:25 Uhr

2023-05-21T07:25:50Z

@@ Zeile 826: / Zeile 826: @@
     #container5-unten   {
        max-width: none;
+    }
+}

Yukii: Die Seite wurde neu angelegt: „ /* Zwei container formatierung Responsive 50/50 / @media only screen { / klassischer Desktop, zweispaltig; Grundstruktur */ #container { overflow: auto; padding-bottom: 1px; } #container-links, #container-rechts { float: left; width: calc(50% - 0.5em - 0.005px); } #container-links { margin-right: 1em; } #container-unten…“

2023-01-16T10:13:06Z

Die Seite wurde neu angelegt: „ ******************************** Zwei container formatierung Responsive 50/50 ********************************: @media only screen { klassischer Desktop, zweispaltig; Grundstruktur: #container { overflow: auto; padding-bottom: 1px; } #container-links, #container-rechts { float: left; width: calc(50% - 0.5em - 0.005px); } #container-links { margin-right: 1em; } #container-unten…“

Neue Seite

/*********************************

Zwei container formatierung Responsive 50/50

*********************************/
@media only screen {
/* klassischer Desktop, zweispaltig; Grundstruktur */
#container {
overflow: auto;
padding-bottom: 1px;
}
#container-links,
#container-rechts {
float: left;
width: calc(50% - 0.5em - 0.005px);
}
#container-links {
margin-right: 1em;
}

#container-unten {
clear: both;
}

#container-oben,
#container-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container-links,
#container-rechts {
float: none;
margin-right: 0;
width: auto;
}

#container-oben,
#container-unten, p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container-links {
float: none;
margin-right: 0;
width: auto;
}
#container-links-container-oben,
#container-links-container-unten {
float: left;
}
#container-oben, #container-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container-links-container-oben,
#container-links-container-unten {
margin-right: 3%;
width: 28%;
}
#container-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container-rechts {
float: none;
width: auto;
}
#container-links-container-oben,
#container-links-container-unten,
#container-rechts-container-oben,
#container-rechts-container-unten {
width: 23%;
}
#container-links-container-oben,
#container-links-container-unten,
#container-rechts-container-oben,
#container-rechts-container-unten {
margin-left: 1%;
margin-right: 1%;
}
#container-rechts-container-oben,
#container-rechts-container-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container-rechts-container-unten {
float: none;
width: auto;
}
#container-links-container-oben,
#container-links-container-unten,
#container-rechts-container-oben,
#container-rechts-container-unten-1,
#container-rechts-container-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container-rechts-container-unten-1,
#container-rechts-container-unten-2 {
float: left;
}
#container-rechts-container-unten-2 {
margin-right: 0;
}

#container-unten {
max-width: none;
}
}

/*********************************

Zwei Spalten formatierung Responsive 75/25

*********************************/
@media only screen {
/* klassischer Desktop, zweispaltig; Grundstruktur */
#container1 {
overflow: auto;
padding-bottom: 1px;
}
#container1-links{
float: left;
width: calc(75% - 0.5em - 0.005px);
}

#container1-rechts {
float: left;
width: calc(25% - 0.5em - 0.005px);
}
#container1-links {
margin-right: 1em;
}

#container1-unten {
clear: both;
}

#container1-oben,
#container1-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container1-links,
#container1-rechts {
float: none;
margin-right: 0;
width: auto;
}

#container1-oben,
#container1-unten,
#willkommen p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container1-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container1-links {
float: none;
margin-right: 0;
width: auto;
}
#container1-links-oben,
#container1-links-unten {
float: left;
}
#container1-oben, #container1-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container1-links-oben,
#container1-links-unten {
margin-right: 3%;
width: 28%;
}
#container1-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container1-rechts {
float: none;
width: auto;
}
#container1-links-oben,
#container1-links-unten,
#container1-rechts-oben,
#container1-rechts-unten {
width: 23%;
}
#container1-links-oben,
#container1-links-unten,
#container1-rechts-oben,
#container1-rechts-unten {
margin-left: 1%;
margin-right: 1%;
}
#container1-rechts-oben,
#container1-rechts-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container1-rechts-unten {
float: none;
width: auto;
}
#container1-links-oben,
#container1-links-unten,
#container1-rechts-oben,
#container1-rechts-unten-1,
#container1-rechts-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container1-rechts-unten-1,
#container1-rechts-unten-2 {
float: left;
}
#container1-rechts-unten-2 {
margin-right: 0;
}

#container1-unten {
max-width: none;
}
}

/*********************************

Zwei Spalten formatierung Responsive 25/75

*********************************/
@media only screen {
/* klassischer Desktop, zweispaltig; Grundstruktur */
#container2 {
overflow: auto;
padding-bottom: 1px;
}
#container2-links{
float: left;
width: calc(25% - 0.5em - 0.005px);
}

#container2-rechts {
float: left;
width: calc(75% - 0.5em - 0.005px);
}
#container2-links {
margin-right: 1em;
}

#container2-unten {
clear: both;
}

#container2-oben,
#container2-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container2-links,
#container2-rechts {
float: none;
margin-right: 0;
width: auto;
}

#container2-oben,
#container2-unten,
#willkommen p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container2-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container2-links {
float: none;
margin-right: 0;
width: auto;
}
#container2-links-oben,
#container2-links-unten {
float: left;
}
#container2-oben, #container2-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container2-links-oben,
#container2-links-unten {
margin-right: 3%;
width: 28%;
}
#container2-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container2-rechts {
float: none;
width: auto;
}
#container2-links-oben,
#container2-links-unten,
#container2-rechts-oben,
#container2-rechts-unten {
width: 23%;
}
#container2-links-oben,
#container2-links-unten,
#container2-rechts-oben,
#container2-rechts-unten {
margin-left: 1%;
margin-right: 1%;
}
#container2-rechts-oben,
#container2-rechts-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container2-rechts-unten {
float: none;
width: auto;
}
#container2-links-oben,
#container2-links-unten,
#container2-rechts-oben,
#container2-rechts-unten-1,
#container2-rechts-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container2-rechts-unten-1,
#container2-rechts-unten-2 {
float: left;
}
#container2-rechts-unten-2 {
margin-right: 0;
}

#container2-unten {
max-width: none;
}
}

/*********************************

Zwei Spalten formatierung Responsive 70/30

*********************************/
@media only screen {
/* klassischer Desktop, zweispaltig; Grundstruktur */
#container4 {
overflow: auto;
padding-bottom: 1px;
}
#container4-links{
float: left;
width: calc(70% - 0.5em - 0.005px);
}

#container4-rechts {
float: left;
width: calc(30% - 0.5em - 0.005px);
}
#container4-links {
margin-right: 1em;
}

#container4-unten {
clear: both;
}

#container4-oben,
#container4-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container4-links,
#container4-rechts {
float: none;
margin-right: 0;
width: auto;
}

#container4-oben,
#container4-unten,
#willkommen p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container4-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container4-links {
float: none;
margin-right: 0;
width: auto;
}
#container4-links-oben,
#container4-links-unten {
float: left;
}
#container4-oben, #container4-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container4-links-oben,
#container4-links-unten {
margin-right: 3%;
width: 28%;
}
#container4-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container4-rechts {
float: none;
width: auto;
}
#container4-links-oben,
#container4-links-unten,
#container4-rechts-oben,
#container4-rechts-unten {
width: 23%;
}
#container4-links-oben,
#container4-links-unten,
#container4-rechts-oben,
#container4-rechts-unten {
margin-left: 1%;
margin-right: 1%;
}
#container4-rechts-oben,
#container4-rechts-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container4-rechts-unten {
float: none;
width: auto;
}
#container4-links-oben,
#container4-links-unten,
#container4-rechts-oben,
#container4-rechts-unten-1,
#container4-rechts-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container4-rechts-unten-1,
#container4-rechts-unten-2 {
float: left;
}
#container4-rechts-unten-2 {
margin-right: 0;
}

#container4-unten {
max-width: none;
}
}

/*********************************

drei container formatierung Responsive 33/33/33

*********************************/
@media only screen {
/* klassischer Desktop, dreispaltig; Grundstruktur */
#container3 {
overflow: auto;
padding-bottom: 1px;
}
#container3-links,
#container3-mitte {
float: left;
width: calc(33% - 0.5em - 0.005px);
}

#container3-rechts {
float: right;
width: calc(33% - 0.5em - 0.005px);
}

#container3-links,
#container3-mitte {
margin-right: 1em;
}

#container3-unten {
clear: both;
}

#container3-oben,
#container3-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container3-links,
#container3-rechts,
#container3-mitte {
float: none;
margin-right: 0;
width: auto;
}

#container3-oben,
#container3-unten, p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container3-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container3-links,
#container3-mitte {
float: none;
margin-right: 0;
width: auto;
}
#container3-links-container3-oben,
#container3-links-container3-unten {
float: left;
}
#container3-oben, #container3-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container3-links-container3-oben,
#container3-links-container3-unten {
margin-right: 3%;
width: 28%;
}

#container3-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container3-rechts {
float: none;
width: auto;
}
#container3-links-container3-oben,
#container3-links-container3-unten,
#container3-rechts-container3-oben,
#container3-rechts-container3-unten {
width: 23%;
}
#container3-links-container3-oben,
#container3-links-container3-unten,
#container3-rechts-container3-oben,
#container3-rechts-container3-unten {
margin-left: 1%;
margin-right: 1%;
}
#container3-rechts-container3-oben,
#container3-rechts-container3-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container3-rechts-container3-unten {
float: none;
width: auto;
}
#container3-links-container3-oben,
#container3-links-container3-unten,
#container3-rechts-container3-oben,
#container3-rechts-container3-unten-1,
#container3-rechts-container3-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container3-rechts-container3-unten-1,
#container3-rechts-container3-unten-2 {
float: left;
}
#container3-rechts-container3-unten-2 {
margin-right: 0;
}

#container3-unten {
max-width: none;
}
}

/*********************************

Zwei Spalten formatierung Responsive 30/70

*********************************/
@media only screen {
/* klassischer Desktop, zweispaltig; Grundstruktur */
#container5 {
overflow: auto;
padding-bottom: 1px;
}
#container5-links{
float: left;
width: calc(70% - 0.5em - 0.005px);
}

#container5-rechts {
float: left;
width: calc(30% - 0.5em - 0.005px);
}
#container5-links {
margin-right: 1em;
}

#container5-unten {
clear: both;
}

#container5-oben,
#container5-unten {
text-align: center;
}
}
@media only screen and (max-width: 54rem) {
/* Platzmangel */
#container5-links,
#container5-rechts {
float: none;
margin-right: 0;
width: auto;
}

#container5-oben,
#container5-unten,
#willkommen p:first-child {
text-align: left;
}
}
@media only screen and (max-width: 42rem) {
/* Besonders kleiner Screen */

#container5-oben {
display: none;
}
}
@media only screen and (min-width: 180rem) {
/* Mehr als zweispaltig; 121rem */
#container5-links {
float: none;
margin-right: 0;
width: auto;
}
#container5-links-oben,
#container5-links-unten {
float: left;
}
#container5-oben, #container5-unten {
max-width: none;
width: auto;
}
}
@media only screen and (min-width: 99999rem) {
/* Dreispaltig */
#container5-links-oben,
#container5-links-unten {
margin-right: 3%;
width: 28%;
}
#container5-rechts {
width: 38%;
}
}
@media only screen and (min-width: 180rem) {
/* Vierspaltig */
#container5-rechts {
float: none;
width: auto;
}
#container5-links-oben,
#container5-links-unten,
#container5-rechts-oben,
#container5-rechts-unten {
width: 23%;
}
#container5-links-oben,
#container5-links-unten,
#container5-rechts-oben,
#container5-rechts-unten {
margin-left: 1%;
margin-right: 1%;
}
#container5-rechts-oben,
#container5-rechts-unten {
float: left;
}
}
@media only screen and (min-width: 260rem) {
/* Fünfspaltig */
#container5-rechts-unten {
float: none;
width: auto;
}
#container5-links-oben,
#container5-links-unten,
#container5-rechts-oben,
#container5-rechts-unten-1,
#container5-rechts-unten-2 {
margin-left: 1%;
margin-right: 1%;
width: 18%;
}
#container5-rechts-unten-1,
#container5-rechts-unten-2 {
float: left;
}
#container5-rechts-unten-2 {
margin-right: 0;
}

#container5-unten {
max-width: none;
}
}

MediaWiki:Mobile.css - Versionsgeschichte

Yukii am 21. Mai 2023 um 07:25 Uhr