MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 33: / Line 33: @@
 }
-/* Infobox and content wrapping */
+/* Flexbox layout for content and infobox */
-.infobox {
-    float: right;
-    margin: 0 0 1em 1em;
-}
 .mw-parser-output {
-     overflow: hidden; /* Forces content to wrap around the float from the top */
+     display: flex; /* Creates a flex container */
+    flex-wrap: wrap; /* Allows wrapping if content exceeds width */
      color: #FFFFFF !important; /* White text for dark background */
 }
 .mw-parser-output h2, .mw-parser-output h3, .mw-parser-output h4, .mw-parser-output h5, .mw-parser-output h6 {
      color: #FFFFFF !important; /* White headings for dark background */
+}
+.infobox {
+    width: 22em; /* Matches template width */
+    margin: 0 0 1em 1em; /* Bottom and left margin */
+    order: 2; /* Places infobox after main content in flex order */
+}
+.mw-parser-output > :not(.infobox) {
+    flex: 1; /* Allows main content to take remaining space */
+    min-width: 0; /* Prevents overflow issues */
+    margin-right: 1em; /* Space between content and infobox */
 }