MediaWiki:Mobile.css: Difference between revisions
No edit summary Tags: Mobile edit Mobile web edit |
No edit summary Tags: Mobile edit Mobile web edit |
||
| Line 1: | Line 1: | ||
/* | @media screen and (max-width: 720px) { | ||
/* 1) Force navbox to show and scroll on narrow screens */ | |||
.content .navbox, | |||
.content .vertical-navbox { | |||
display: block !important; | |||
overflow-x: auto !important; | |||
-webkit-overflow-scrolling: touch !important; | |||
box-sizing: border-box; | |||
width: 100%; | |||
} | |||
/* | /* 2) Make the inner table width “auto” so it can overflow horizontally */ | ||
. | .content .navbox-inner { | ||
.navbox-inner { | display: block !important; | ||
width: max-content !important; | |||
min-width: 100% !important; | |||
} | |||
} | |||
/* | /* 3) Line up your list items in one row */ | ||
.navbox-group, | .navbox-group, | ||
.navbox-list { | .navbox-list { | ||
white-space: nowrap; | |||
margin: 0; | |||
padding: 0; | |||
} | } | ||
.navbox-group > li, | .navbox-group > li, | ||
.navbox-list > li { | .navbox-list > li { | ||
display: inline-block; | |||
float: none; | |||
} | |||
} | } | ||
Revision as of 21:13, 24 April 2025
@media screen and (max-width: 720px) {
/* 1) Force navbox to show and scroll on narrow screens */
.content .navbox,
.content .vertical-navbox {
display: block !important;
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
box-sizing: border-box;
width: 100%;
}
/* 2) Make the inner table width “auto” so it can overflow horizontally */
.content .navbox-inner {
display: block !important;
width: max-content !important;
min-width: 100% !important;
}
/* 3) Line up your list items in one row */
.navbox-group,
.navbox-list {
white-space: nowrap;
margin: 0;
padding: 0;
}
.navbox-group > li,
.navbox-list > li {
display: inline-block;
float: none;
}
}