MediaWiki:Common.css: Unterschied zwischen den Versionen

← Zum vorherigen Versionsunterschied Zum nächsten Versionsunterschied →

@@ Zeile 1.787: / Zeile 1.787: @@
 .kat-links a:hover { background:#f8f9fa; }
-/* --- Mobile: Infobox oben, 100% Breite, Bild passt sich an --- */
+/* --- Mobile: Infobox oben, 100% breit; Bild passt sich an --- */
 @media (max-width: 768px) {
-   /* Infobox nicht mehr rechts floaten und 100% breit machen */
+   /* Infobox entfloaten + volle Breite */
-   .mw-parser-output table.infobox {
+   .mw-parser-output table.infobox,
+  .mw-parser-output table.biobox {
      float: none !important;
      clear: both !important;
      display: block !important;
-     width: 100% !important;
+     width: 100% !important;        /* überstimmt width:240px aus dem Template */
      max-width: 100% !important;
      margin: 0 0 1em 0 !important;
      box-sizing: border-box;
-     background: #fff; /* falls Skin grau hinterlegt */
+     background: #fff;
    }
-   /* Bild in der Infobox responsiv über die ganze Zellenbreite */
+   /* Bild über die volle Zellenbreite skalieren */
    .mw-parser-output table.infobox a.image,
-   .mw-parser-output table.infobox a.image img {
+   .mw-parser-output table.biobox a.image {
      display: block;
+  }
+  .mw-parser-output table.infobox a.image img,
+  .mw-parser-output table.biobox a.image img {
      width: 100% !important;
      height: auto !important;
+    display: block;
    }
-   /* Kein seitlicher Text neben der Box */
+   /* Text sicher unterhalb starten */
    .mw-parser-output > p:first-of-type {
      clear: both !important;
    }
-   /* Nachfolgende rechts-ausgerichtete Tabelle (Social-Icons) neutralisieren */
+   /* Falls direkt nach der Infobox noch eine rechts-ausgerichtete Tabelle kommt (Social-Icons),
-   .mw-parser-output table.infobox + table[align="right"] {
+     neutralisieren wir die auf Mobil, damit sie nichts nach rechts schiebt. */
+   .mw-parser-output table.infobox + table[align="right"],
+  .mw-parser-output table.biobox + table[align="right"] {
      float: none !important;
      width: 100% !important;