http://www.schnupptrupp.org/w/index.php?action=history&feed=atom&title=MediaWiki%3AGadget-StickyTableHeaders.css 2026-04-07T01:05:49Z Versionsgeschichte dieser Seite in SchnuppTrupp MediaWiki 1.24.1 http://www.schnupptrupp.org/w/index.php?title=MediaWiki:Gadget-StickyTableHeaders.css&diff=178238&oldid=prev 2020-05-12T19:41:19Z

<p>Die Seite wurde neu angelegt: „/* keeps table headers stuck to the top of the window, useful for long tables where it normally scrolls offscreen KNOWN PROBLEMS - borders disappe…“</p> <p><b>Neue Seite</b></p><div>/* keeps table headers stuck to the top of the window,<br /> useful for long tables where it normally scrolls offscreen<br /> <br /> KNOWN PROBLEMS<br /> - borders disappear due to browser implementation issue (https://bugs.webkit.org/show_bug.cgi?id=128486)<br /> - multi-row headers overlap each other since MediaWiki doesn't support &lt;thead&gt;<br /> - Chrome/Opera/Edge don't support sticky on &lt;thead&gt; anyway (https://caniuse.com/#feat=css-sticky)<br /> <br /> USAGE<br /> - sticky headers are opt-in using the &quot;sticky-header&quot; class (eg. {| class=&quot;wikitable sticky-header&quot;)<br /> - don't add sticky headers to tables with multiple rows of headers<br /> - don't add sticky headers to tables shorter than roughly 1000px - use your best judgement<br /> - don't add sticky headers to tables that have captions (marked with |+)<br /> */<br /> <br /> .sticky-header:not(.lighttable) th,<br /> .sticky-header.lighttable &gt; *:not(tfoot) th {<br /> position: -webkit-sticky;<br /> position: sticky;<br /> top: -1px; /* chrome has a see-through border? */<br /> border-bottom: 1px solid transparent;<br /> }<br /> <br /> /* fake a bottom border - see known problems */<br /> .sticky-header:not(.lighttable) th::after,<br /> .sticky-header.lighttable &gt; *:not(tfoot) th::after {<br /> content: '';<br /> position: absolute;<br /> left: 0;<br /> bottom: 0;<br /> width: 100%;<br /> border-bottom: 1px solid #dcdcdc;<br /> }<br /> <br /> /* dark mode border color */<br /> .wgl-darkmode .sticky-header:not(.lighttable) th::after,<br /> .wgl-darkmode .sticky-header.lighttable &gt; *:not(tfoot) th::after {<br /> border-bottom-color: #172136;<br /> }<br /> <br /> /* move down when sticky page header is enabled */<br /> .wgl-stickyheader.action-view .sticky-header:not(.lighttable) th,<br /> .wgl-stickyheader.action-view .sticky-header.lighttable &gt; *:not(tfoot) th {<br /> top: 3em;<br /> }</div>

Bowserkor