Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:Citizen.css

MediaWiki interface page
Revision as of 02:59, 5 February 2026 by Admin (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Default: Full width */
:root.citizen-feature-custom-width-clientpref-standard,
:root {
	--width-layout: 100vw;
}

/* Override for specific pages using body class */
.page-Main_Page,
.page-Hauptseite {
	--width-layout: 1600px;
}

/* Mobile fixes - prevent horizontal overflow */
@media (max-width: 768px) {
	body {
		overflow-x: hidden !important;
	}

    :root.citizen-feature-custom-width-clientpref-full,
      :root {
	    --width-layout: 100%;
      }
	
	.mw-page-container,
	.page-Container,
	.mw-body,
	.mw-body-content {
		max-width: 100vw !important;
		overflow-x: hidden !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}
	
	/* Fix for full-width elements causing overflow */
	* {
		max-width: 100%;
	}
	
	/* Reset any fixed positioning that might cause issues */
	.home-header,
	.mw-parser-output {
		width: 100% !important;
		max-width: 100% !important;
		overflow-x: hidden !important;
		box-sizing: border-box !important;
	}
}

/* Fix Citizen mobile layout - content shifted right */
@media (max-width: 999px) {
	/* Reset page container positioning */
	.mw-page-container {
		position: relative !important;
		left: 0 !important;
		right: 0 !important;
		transform: none !important;
		margin: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}
	
	/* Reset content wrapper */
	.mw-content-container,
	.mw-body {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}
	
	/* Fix any transform/translate issues */
	body {
		overflow-x: hidden !important;
	}
	
	html {
		overflow-x: hidden !important;
	}
}