User:James Hare/vector.css

From Wikimedia District of Columbia
< User:James Hare
Revision as of 20:38, 6 June 2013 by James Hare (talk | contribs) (Testing)
Jump to navigation Jump to search

Note: After saving, 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)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* For mobile devices */

@media only screen and (max-device-width:480px) {
  
  /*
    The styles below essentially place the navigation menu below the content,
    instead of to the side of it. They also hide the logo, as there's no space
    left for it.
  */
  
  /* Move the panel to the bottom and display it horizontally; hide the logo */
  div#mw-panel {
    display: table;
    position: static;
    table-layout: fixed;
    width: 100%;
  }
  div#mw-panel .portal {
    display: block;
    width:100%;
    vertical-align: top;
  }
  #mw-panel ul li {
    list-style-type:circle;
    display:inline;
  }
  #p-logo {
    display: none;
  }

  /* Rearrange various page elements to fill the now-available space */
  #p-personal ul {
    padding-left: 0;
  }
  div#footer {
    margin-left: 0;
    padding-top: 0;
  }
  div#content {
    /* Hide the 1px blue border on the left side */
    border-left: 0;
    margin-left: 0;
  }
  #left-navigation {
    /* Make sure the 1px blue border on the left side is not visible */
    margin-left: -1px;
  }
  #mw-head-base {
    margin-left: 0;
  }
}