Jump to content

MediaWiki:Common.css: Difference between revisions

From Webnigerians Wiki
Created page with "CSS placed here will be applied to all skins: Basic infobox styling & right alignment: .infobox { float: right; clear: right; margin: 0 0 1em 1em; space below & left: width: 22em; optional; adjust as you like: background: #f8f9fa; border: 1px solid #a2a9b1; border-collapse: collapse; font-size: 90%; } .infobox th, .infobox td { border: 1px solid #a2a9b1; padding: 0.2em 0.4em; } .infobox caption, .infobox .infobo..."
 
No edit summary
 
Line 27: Line 27:
@media (max-width: 768px) {
@media (max-width: 768px) {
   .infobox { float: none; margin: 0 auto 1em; }
   .infobox { float: none; margin: 0 auto 1em; }
}
/* Main Page card boxes */
.mainpage-box {
  border: 1px solid #a2a9b1;
  background: #f8f9fa;
  padding: 10px 14px;
  margin: 0 0 16px 0;
  border-radius: 6px;
}
/* Headings spacing inside boxes */
.mainpage-box h2, .mainpage-box h3 {
  margin-top: 0.2em;
}
/* Keep columns stacked nicely on phones */
@media (max-width: 900px) {
  .mainpage-columns { display:block !important; }
}
}

Latest revision as of 12:06, 3 October 2025

/* CSS placed here will be applied to all skins */


/* Basic infobox styling & right alignment */
.infobox {
  float: right;
  clear: right;
  margin: 0 0 1em 1em;      /* space below & left */
  width: 22em;              /* optional; adjust as you like */
  background: #f8f9fa;
  border: 1px solid #a2a9b1;
  border-collapse: collapse;
  font-size: 90%;
}
.infobox th, .infobox td {
  border: 1px solid #a2a9b1;
  padding: 0.2em 0.4em;
}
.infobox caption,
.infobox .infobox-title {
  text-align: center;
  font-weight: bold;
  padding: 0.4em;
  background: #eaecf0;
}
/* On narrow screens, don’t float */
@media (max-width: 768px) {
  .infobox { float: none; margin: 0 auto 1em; }
}









/* Main Page card boxes */
.mainpage-box {
  border: 1px solid #a2a9b1;
  background: #f8f9fa;
  padding: 10px 14px;
  margin: 0 0 16px 0;
  border-radius: 6px;
}

/* Headings spacing inside boxes */
.mainpage-box h2, .mainpage-box h3 {
  margin-top: 0.2em;
}

/* Keep columns stacked nicely on phones */
@media (max-width: 900px) {
  .mainpage-columns { display:block !important; }
}