Difference between revisions of "User:James Hare/vector.css"
Jump to navigation
Jump to search
James Hare (talk | contribs) (Working) |
James Hare (talk | contribs) (Based on work by MatmaRex) |
||
Line 2: | Line 2: | ||
@media only screen and (max-device-width:480px) { |
@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 */ |
||
⚫ | |||
+ | display: table; |
||
+ | position: static; |
||
+ | table-layout: fixed; |
||
+ | width: 100%; |
||
} |
} |
||
− | # |
+ | div#mw-panel .portal { |
− | + | display: table-cell; |
|
+ | vertical-align: top; |
||
+ | } |
||
+ | #p-logo { |
||
⚫ | |||
+ | } |
||
+ | |||
+ | /* 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; |
||
} |
} |
||
} |
} |
Revision as of 20:15, 6 June 2013
/* 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: table-cell;
vertical-align: top;
}
#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;
}
}