MikeSaunders: 1 revision imported

2023-11-02T13:09:28Z

1 revision imported

← Older revision	Revision as of 13:09, 2 November 2023
(No difference)

wikipedia>Timeshifter: "It only works with sortable tables." Moved to top so I am less likely to forget it again. :

2023-10-17T12:48:14Z

"It only works with sortable tables." Moved to top so I am less likely to forget it again. :

New page

{{Documentation subpage}}
{{uses TemplateStyles|Template:Sticky header/styles.css}}

This adds a floating, sticky header to a table in desktop view, but not on cell phones. '''It only works with sortable tables.'''

It has been tested, and works, in these browsers: '''Firefox, Edge, Chrome, Opera.''' Header borders are missing in '''Firefox.''' For more info see: '''[[Help:Table#Tables with sticky headers]]'''

It works with simple one-line headers, and with complex, multi-line, multi-row headers that use colspan and rowspan in the headers.

See [[Special:WhatLinksHere/Template:Sticky header|list of articles]] transcluding {{tlc|sticky header}}. See [https://templatecount.toolforge.org/index.php?lang=en&namespace=10&name=Sticky_header#bottom transclusion count].

== Usage ==
:'''''Note:''' See '''[[User:Timeshifter/Sandbox230#Single-row_header|sandbox with examples]].'''''

'''{{tlc|sticky header}}''' just above the table wikitext.

'''<code>class=sticky-header</code>''' to the top line of the table wikitext along with '''<code>class=sortable</code>'''. For example:

:<syntaxhighlight lang=wikitext>
{{sticky header}}
{| class="wikitable sortable sticky-header"
⫶
|}
</syntaxhighlight>

<div style="display:inline-table; border: 2px solid lime; padding: 0.5em;">
'''With sticky template'''
{{sticky header}}
{| class="wikitable sortable sticky-header"
|+ rowspan and colspan
|-
! rowspan=2 | Name
! colspan=3 style=max-width:8em | Data columns are below
|-
! 1
! 2
! 3
|- {{sort row|4}}
| Name1 || 1-1 || 2-1 || 3-1
|-
| Name2 || 1-2 || 2-2 || 3-2
|-
| Name3 || 1-3 || 2-3 || 3-3
|-
| Name4 || 1-4 || 2-4 || 3-4
|-
| Name5 || 1-5 || 2-5 || 3-5
|-
| Name6 || 1-6 || 2-6 || 3-6
|}
</div>

== Special cases ==
:'''''Note:''' See '''[[User:Timeshifter/Sandbox230#Single-row_header|sandbox with examples]].'''''
'''Sometimes a single-row sticky header is required due to subsection table header rows within the table.''' Note placement of '''<code>class=sticky</code>''' below. Scroll down well into the table to see that the headers before subsections of the table do not stick. Those subsection headers should not stick since they change as you scroll down the table.
<div style="border: 2px solid lime; padding: 0.5em;">
'''Wiki source excerpt:'''
<syntaxhighlight lang=wikitext highlight=1,4>
{{mw-datatable}}{{sticky header}}
{| class="wikitable sortable mw-datatable"
|+COVID-19 vaccines authorized for emergency use or approved for full use
|- class=sticky
!
</syntaxhighlight>
</div>

Go down to a section farther down in the '''[[User:Timeshifter/Sandbox230#Single-row_header|example sandbox]]''' for a '''more complex table with multi-row headers,''' and '''table subsections.''' A '''different solution''' was required.

== Problems and solutions ==

See: '''[[Template talk:Sticky header]].'''

It works with {{tl|static row numbers}}. But it does not work with this subtemplate: {{tl|static row numbers table}} (go there to see what to replace it with). It breaks this subtemplate: {{tl|static row numbers arrows}}. The separate sort row disappears. Use {{tl|sort row}} instead.

<includeonly>{{Sandbox other||


}}</includeonly>

Template:Sticky header/doc - Revision history

MikeSaunders: 1 revision imported

wikipedia>Timeshifter: "It only works with sortable tables." Moved to top so I am less likely to forget it again. :