Main Page:mediawiki:common.css: Difference between revisions
(Created page with "→: .table-responsive { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; →: } →: .table-responsive:focus { outline: 2px solid #777; outline-offset: 2px; } →: .table-responsive > table { width: 100%; border-collapse: collapse; } →: .wikitable t...") |
No edit summary |
||
| Line 40: | Line 40: | ||
.wikitable td, .wikitable th { font-size: 14px; } | .wikitable td, .wikitable th { font-size: 14px; } | ||
} | } | ||
/* small arrows for sortable columns */ | |||
table.sortable th.headerSortUp:after { content: " ▲"; } | |||
table.sortable th.headerSortDown:after { content: " ▼"; } | |||
/* keep word-wrap and mobile scroll (if you haven't already) */ | |||
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; display:block; } | |||
.wikitable td, .wikitable th { white-space: normal; word-break: break-word; padding:6px 8px; } | |||
Revision as of 17:40, 26 August 2025
/* Universal responsive wrapper behavior */ .table-responsive {
display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; /* smooth scroll on iOS */
}
/* Make focused wrappers keyboard-visible (a11y) */ .table-responsive:focus {
outline: 2px solid #777; outline-offset: 2px;
}
/* Keep tables full-width inside wrapper */ .table-responsive > table {
width: 100%; border-collapse: collapse;
}
/* Better text wrapping on small screens */ .wikitable td, .wikitable th {
white-space: normal; word-break: break-word; padding: 6px 8px;
}
/* Optional: sticky header inside scroll container */ .table-responsive thead th {
position: sticky; top: 0; z-index: 1;
}
/* Opt-out: any table with .no-responsive will not be wrapped */ .no-responsive { /* marker class only */ }
/* (Optional) tiny-screen tweaks */ @media (max-width: 480px) {
.wikitable td, .wikitable th { font-size: 14px; }
} /* small arrows for sortable columns */ table.sortable th.headerSortUp:after { content: " ▲"; } table.sortable th.headerSortDown:after { content: " ▼"; }
/* keep word-wrap and mobile scroll (if you haven't already) */ .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; display:block; } .wikitable td, .wikitable th { white-space: normal; word-break: break-word; padding:6px 8px; }