Vorlage:Infobar/style.css: Unterschied zwischen den Versionen

Vorlage:Infobar/style.css (Quelltext anzeigen)

Version vom 3. April 2024, 14:08 Uhr

609 Bytes entfernt , 3 April

keine Bearbeitungszusammenfassung

RaWen

Oberflächenadministratoren, Administratoren

20.757

Bearbeitungen

@@ Zeile 84: / Zeile 84: @@
 @media (max-width: 440px) {
      .infobar {
-         overflow-x: auto; /* Ermöglicht horizontales Scrollen für den gesamten Infobar-Container */
+         overflow-x: auto; /* Ermöglicht horizontales Scrollen innerhalb der Infobar */
-         display: inline-flex; /* Ändert das Display zu inline-flex, um die natürliche Breite des Inhalts zu nutzen */
+         width: 100%; /* Stellt sicher, dass die Infobar die volle Breite des Viewports einnimmt */
-         flex-wrap: nowrap; /* Verhindert das Umbruchverhalten, um eine horizontale Scrollbar zu erzwingen */
+         min-width: 400px; /* Setzt eine Mindestbreite, um das Desktop-Layout beizubehalten */
-        width: auto; /* Ermöglicht, dass die Breite des Containers seinen Inhalten entspricht */
+         box-sizing: border-box; /* Stellt sicher, dass Padding und Border innerhalb der Breite enthalten sind */
-        gap: 10px; /* Anpassung des Gaps für eine kompaktere Darstellung */
-    }
-    .infobar > * {
-        flex: 0 0 auto; /* Stellt sicher, dass die Kinder des Infobar-Containers nicht gestreckt werden */
-         white-space: nowrap; /* Verhindert Textumbrüche bei Titeln oder anderen Inhalts-Elementen */
-    }
-    .infobar-icon, .infobar-img {
-        flex-shrink: 0; /* Verhindert, dass Icons und Bilder schrumpfen */
-    }
-    .infobar-text {
-        flex-grow: 1; /* Erlaubt dem Textbereich, verfügbaren Raum zu nutzen, ohne dass ein Umbruch erzwungen wird */
      }
 }