Template:Navbox with columns/CSS

Specialised CSS is required to make this, and the other navbox templates, look its best. Almost every aspect of the navbox templates is styled through CSS, rather than declared inline within navbox or navbox with columns.

The following is a sample CSS file that you can use as a basis for styling navboxes to your liking. Note that almost every administrator will not find this initial CSS particularly appealing, as it has been made to fit in with the colour palette at w:c:tardis, and is therefore a mixture of dark blues, greys and whites.

You can use the following file in a number of different ways. The easiest, however, is to cut and paste it directly into your MediaWiki:Common.css — and then make sure you @import your Common.css into your MediaWiki:Wikia.css. To do this, add a line like this at the top of your MediaWiki:Wikia.css: @import url("/load.php?debug=false&&allinone=0&lang=en&mode=articles&articles=MediaWiki:Common.css&only=styles") Once you've done that, and cleared your cache a few times, you'll find that the navbox CSS will work in both the Monobook and the Oasis/Wikia skins. /* ===========================  Navbox styling

based upon code found at   http://wikipedia.org/wiki/MediaWiki:Common.css where a complete list of contributors can be found

altered by User:CzechOut at  http://tardis.wikia.com/wiki/MediaWiki:NavboxWP.css =========================== */

.navbox {                    /* Navbox container style */ /*border: 1px solid #aaa;*/ border:none; width: 100%; margin: auto; clear: both; font-size: 88%; text-align: center; padding: 1px; } .navbox-inner, .navbox-subgroup { width: 100%; } .navbox-group,na .navbox-title, .navbox-abovebelow { padding: 0.25em 1em;     /* Title, group and above/below styles */ line-height: 1.5em; text-align: center; } .navbox-group { background:#012c57; color:#fff } th.navbox-group {            /* Group style */ white-space: nowrap; /* @noflip */ text-align: right; background-color:#555!important; } .navbox, .navbox-subgroup { background: #fdfdfd;     /* Background color */ } .navbox-list { line-height: 1.2em; /* original 1.8em */ /* border-color: #fdfdfd;   Must match background color */ border-color:#012c57; border-left:2px solid #fdfdfd; } .navbox th, .navbox-title { /* background: #ccccff;      Level 1 color */ background:#012c57; color:white; } .navbox-abovebelow, th.navbox-group, .navbox-subgroup .navbox-title { /*background: #ddddff;      Level 2 color */ background:#012c57; color:white; } .navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow { /* background: #e6e6ff;      Level 3 color */ background:#333333; } .navbox-even { /* background: #f7f7f7;      Even row striping */ background:#DCDCDC; } .navbox-odd { /* background: transparent;  Odd row striping */ /*background:#E5E4E2;*/ background:#b0b0b0; } table.navbox + table.navbox { /* Single pixel border between adjacent navboxes */ margin-top: -1px;         /* (doesn't work for IE6, but that's okay)       */ } .navbox .hlist td dl, .navbox .hlist td ol, .navbox .hlist td ul, .navbox td.hlist dl, .navbox td.hlist ol, .navbox td.hlist ul { padding: 0.125em 0;      /* Adjust hlist padding in navboxes */ } ol + table.navbox, ul + table.navbox { margin-top: 0.1em;       /* Prevent lists from clinging to navboxes */ } /* Default styling for Navbar template */ .navbar { display: inline; font-size: 88%; font-weight: normal; } .navbar ul { white-space: nowrap; } .navbar li { word-spacing: -0.125em; } .navbar.mini li span { font-variant: small-caps; } /* Navbar styling when nested in infobox and navbox */ .infobox .navbar { font-size: 100%; } .navbox .navbar { display: block; font-size: 100%; } /* .navbox-title .navbar { float: left; text-align: left; margin-right: 0.5em; width: 6em; } /* 'show'/'hide' buttons created dynamically by the CollapsibleTables javascript in MediaWiki:Common.js are styled here so they can be customised. */ .collapseButton { /* @noflip */ float: right; font-weight: normal; /* @noflip */ margin-left: 0.5em; /* @noflip */ text-align: right; width: auto; } /* In navboxes, the show/hide button balances the v·d·e links from Template:Navbar, so they need to be the same width. */ .navbox .collapseButton { width: 6em; } /* Styling for JQuery makeCollapsible, matching that of collapseButton */ .mw-collapsible-toggle { font-weight: normal; /* @noflip */ text-align: right; float:right; margin-top:.8em; } .navbox .mw-collapsible-toggle { width: 6em; } .navbox-odd a:visited, .navbox-odd a:link, .navbox-even a:visited, .navbox-even a:link { color:#012c57 } /* .navbox-list .navbox-even a:link, .navbox-list .navbox-even a:visited, .navbox-list .navbox-odd a:link, .navbox-list .navbox-odd a:visited { color:#fff; } .navbox-group a:link, .navbox-group a:visited, .navbox-title a:link, .navbox-title a:visited, .navbox-abovebelow a:link, .navbox-abovebelow a:visited { color:#fff } .navbox a:hover { color:#012c57 } .nv-view, .nv-talk, .nv-edit { float:left; list-style:none; font-weight:bold; padding-right:5px; } .nv-edit:before, .nv-talk:before { content:" • "; } .navbar.mini li span { font-variant:normal; }