Jump to content

Help talk:Table/Archive 8

Page contents not supported in other languages.
From Wikipedia, the free encyclopedia
Archive 5Archive 6Archive 7Archive 8Archive 9Archive 10

Partially collapsed table with vertical scrolling and show/hide links?

{{COVID-19 pandemic death rates by country}}

Is there a simple way to convert this below to a partially collapsed table with vertical scrolling? Along with show/hide links?

COVID-19 pandemic death rates by country.
Updated December 22, 2024.
COVID-19 pandemic cases and mortality by country[1]
Country Deaths / million Deaths Cases
World[a] 886 7,078,473 777,025,779
Peru 6,601 220,994 4,528,708
Bulgaria 5,679 38,770 1,338,863
North Macedonia 5,428 9,990 352,060
Bosnia and Herzegovina 5,118 16,404 404,053
Hungary 5,071 49,113 2,237,196
Croatia 4,806 18,781 1,352,244
Slovenia 4,686 9,914 1,360,799
Georgia 4,519 17,151 1,864,383
Montenegro 4,317 2,654 251,280
Czech Republic 4,099 43,758 4,822,554
Moldova 4,040 12,283 650,808
Latvia 3,973 7,475 977,765
Slovakia 3,884 21,262 1,885,292
Greece 3,822 39,799 5,745,103
San Marino 3,693 126 25,292
Romania 3,597 68,945 3,567,265
United States 3,541 1,209,547 103,436,829
Lithuania 3,500 9,862 1,417,828
United Kingdom 3,404 232,112 25,019,756
Brazil 3,338 702,116 37,511,921
Italy 3,313 197,542 26,826,486
Chile 3,298 64,497 5,407,797
Martinique 3,159 1,104 230,354
Poland 3,151 120,962 6,766,496
Armenia 3,047 8,779 453,040
Gibraltar 3,002 113 20,550
Belgium 2,949 34,339 4,892,342
Paraguay 2,940 19,880 735,759
Trinidad and Tobago 2,934 4,390 191,496
Argentina 2,878 130,721 10,110,138
European Union[b] 2,822 1,266,374 186,318,205
Portugal 2,790 29,071 5,670,137
Russia 2,774 403,875 24,738,306
Colombia 2,758 142,727 6,394,609
Aruba 2,708 292 44,224
Sweden 2,694 28,259 2,768,898
Ukraine 2,677 109,925 5,541,377
Serbia 2,658 18,057 2,583,470
Guadeloupe 2,653 1,021 203,235
France 2,615 168,122 39,008,711
Mexico 2,603 334,810 7,622,467
Spain 2,547 121,852 13,980,340
Bermuda 2,547 165 18,860
Guam 2,536 419 52,287
Austria 2,485 22,534 6,082,991
Tunisia 2,427 29,423 1,153,361
French Polynesia 2,318 650 79,451
Saint Lucia 2,293 410 30,231
Uruguay 2,268 7,691 1,042,301
Liechtenstein 2,262 89 21,611
Suriname 2,256 1,406 82,504
Estonia 2,220 2,998 613,303
Malta 2,209 1,167 123,577
Sint Maarten 2,182 92 11,051
Bahamas 2,135 849 39,127
Barbados 2,100 593 108,836
Germany 2,080 174,979 38,437,756
Finland 2,058 11,466 1,499,712
Grenada 2,035 238 19,693
Ecuador 2,022 36,055 1,078,897
Andorra 1,994 159 48,015
Panama 1,989 8,756 1,044,987
Republic of Ireland 1,939 9,909 1,751,577
Lebanon 1,905 10,947 1,239,904
Kosovo 1,869 3,212 274,279
Bolivia 1,853 22,387 1,212,156
Costa Rica 1,844 9,374 1,235,806
Puerto Rico 1,832 5,938 1,252,713
Hong Kong 1,798 13,466 2,876,106
Montserrat 1,787 8 1,403
Monaco 1,720 67 17,181
Belize 1,708 688 71,430
Denmark 1,696 10,012 3,444,552
British Virgin Islands 1,669 64 7,643
Curaçao 1,645 305 45,883
South Africa 1,644 102,595 4,072,837
Iran 1,640 146,837 7,627,863
Switzerland 1,611 14,170 4,473,404
Cyprus 1,591 1,497 709,396
Collectivity of Saint Martin 1,591 46 12,324
Guyana 1,584 1,302 74,492
Antigua and Barbuda 1,572 146 9,106
Jersey 1,555 161 66,391
Luxembourg 1,530 1,000 396,576
United States Virgin Islands 1,525 132 25,389
Caribbean Netherlands 1,430 41 11,922
Canada 1,424 55,282 4,819,055
Namibia 1,422 4,110 172,556
Israel 1,395 12,707 4,841,558
French Guiana 1,384 413 98,041
Isle of Man 1,378 116 38,008
Seychelles 1,370 172 51,892
Netherlands 1,283 22,986 8,640,446
Albania 1,275 3,608 337,196
Jamaica 1,274 3,619 157,343
Jordan 1,254 14,122 1,746,997
Saint Vincent and the Grenadines 1,214 124 9,674
Eswatini 1,170 1,427 75,356
Turkey 1,164 101,419 17,004,712
Botswana 1,148 2,801 330,696
Guatemala 1,131 20,203 1,250,394
Dominica 1,106 74 16,047
New Caledonia 1,093 314 80,203
Malaysia 1,076 37,351 5,325,669
Palestine 1,075 5,708 703,228
Honduras 1,062 11,114 472,911
Réunion 1,056 921 494,595
Guernsey 1,051 67 35,326
Norway 1,050 5,732 1,529,801
Azerbaijan 1,005 10,353 836,492
Bahrain 1,001 1,536 696,614
Saint Kitts and Nevis 984 46 6,607
Oman 978 4,628 399,449
Australia 963 25,236 11,861,161
Fiji 962 885 69,047
Kazakhstan 951 19,072 1,504,370
Libya 891 6,437 507,269
Northern Mariana Islands 889 41 14,985
New Zealand 873 4,483 2,660,355
Turks and Caicos Islands 872 40 6,833
Anguilla 844 12 3,904
Mauritius 841 1,074 329,294
Cabo Verde 802 417 64,474
Wallis and Futuna 782 9 3,760
Belarus 775 7,118 994,045
Cuba 771 8,530 1,113,662
Sri Lanka 740 16,907 672,812
Taiwan 739 17,672 9,970,937
American Samoa 702 34 8,359
South Korea 693 35,934 34,571,873
El Salvador 673 4,230 201,965
Mongolia 630 2,136 1,011,489
Mayotte 612 187 42,027
Maldives 602 316 186,694
Japan 597 74,694 33,803,572
Philippines 586 66,864 4,173,631
Indonesia 581 162,059 6,829,949
Federated States of Micronesia 579 65 31,765
Iraq 575 25,375 2,465,545
Palau 562 10 6,372
Kuwait 559 2,570 667,290
Faroe Islands 518 28 34,658
Cayman Islands 516 37 31,472
Iceland 489 186 210,722
Thailand 484 34,741 4,806,280
Saint Barthélemy 456 5 5,507
Morocco 436 16,305 1,279,115
Vietnam 433 43,206 11,624,000
Marshall Islands 424 17 16,297
Nepal 404 12,031 1,003,450
Brunei 399 182 349,830
Dominican Republic 390 4,384 661,103
Greenland 374 21 11,971
India 374 533,658 45,044,521
Myanmar 362 19,494 643,238
Singapore 358 2,024 3,006,155
Zimbabwe 357 5,740 266,396
Sao Tome and Principe 353 80 6,771
Saint Pierre and Miquelon 347 2 3,426
Lesotho 310 709 36,138
Saudi Arabia 299 9,646 841,469
Solomon Islands 254 199 25,954
Qatar 238 690 514,524
United Arab Emirates 229 2,349 1,067,030
Egypt 220 24,830 516,023
Venezuela 207 5,856 552,695
Mauritania 204 997 63,879
Zambia 202 4,078 349,892
Afghanistan 197 7,998 235,214
Comoros 193 161 9,109
Kiribati 183 24 5,085
Cambodia 177 3,056 139,325
Bangladesh 174 29,499 2,051,516
Macau 174 121 3,514
Djibouti 166 189 15,690
Algeria 151 6,881 272,175
Kyrgyzstan 147 1,024 88,953
Samoa 144 31 17,057
Gambia 141 372 12,627
Syria 140 3,163 57,423
Cook Islands 135 2 7,375
Malawi 130 2,686 89,168
Gabon 126 307 49,056
Pakistan 125 30,656 1,580,631
Tonga 123 13 16,992
Senegal 111 1,972 89,316
Rwanda 107 1,468 133,266
Kenya 104 5,689 344,113
Sudan 102 5,046 63,993
Equatorial Guinea 101 183 17,130
Timor-Leste 100 138 23,460
Tuvalu 99 1 2,943
Laos 88 671 219,060
China[c] 85 122,388 99,381,370
Nauru 84 1 5,393
Guinea-Bissau 84 177 9,614
Uganda 76 3,632 172,159
Somalia 76 1,361 27,334
Haiti 74 860 34,690
Cameroon 71 1,974 125,279
Mozambique 68 2,252 233,845
Papua New Guinea 65 670 46,864
Republic of the Congo 64 389 25,234
Ethiopia 60 7,574 501,258
Yemen 56 2,159 11,945
Liberia 54 294 8,090
Angola 54 1,937 107,487
Madagascar 46 1,428 68,582
Vanuatu 44 14 12,019
Ghana 44 1,463 172,324
Nicaragua 36 245 16,196
Guinea 33 468 38,582
Mali 32 743 33,180
Togo 31 290 39,537
Eritrea 30 103 10,189
Uzbekistan 29 1,016 175,082
Ivory Coast 27 835 88,455
Bhutan 26 21 62,697
Central African Republic 22 113 15,443
Burkina Faso 17 400 22,160
Sierra Leone 15 126 7,985
Democratic Republic of the Congo 14 1,474 100,984
Nigeria 14 3,155 267,189
South Sudan 13 147 18,855
Tanzania 13 846 43,312
Niger 12 315 9,528
Tajikistan 12 125 17,786
Benin 11 163 28,036
Chad 10 194 7,702
Burundi 1 15 54,569
Vatican City 0 0 26
Niue 0 0 1,092
Falkland Islands 0 0 1,923
Saint Helena, Ascension and Tristan da Cunha 0 0 2,166
Pitcairn Islands 0 0 4
Tokelau 0 0 80
North Korea 0 0 0
Turkmenistan 0 0 0
  1. ^ Countries which do not report data for a column are not included in that column's world total.
  2. ^ Data on member states of the European Union are individually listed, but are also summed here for convenience. They are not double-counted in world totals.
  3. ^ Does not include special administrative regions (Hong Kong and Macau) or Taiwan.
{| class="wikitable mw-collapsible mw-collapsed"
![[COVID-19 pandemic death rates by country]]. 
|-
|{{Template:COVID-19 pandemic death rates by country}}
|}

References

  1. ^ Mathieu, Edouard; Ritchie, Hannah; Rodés-Guirao, Lucas; Appel, Cameron; Giattino, Charlie; Hasell, Joe; Macdonald, Bobbie; Dattani, Saloni; Beltekian, Diana; Ortiz-Ospina, Esteban; Roser, Max (2020–2024). "Coronavirus Pandemic (COVID-19)". Our World in Data. Retrieved 2024-12-22.

The table reference will show up in the references section of the article it is in. I used {{talk refs}} here to place the references in this talk section.

There is discussion here:

--Timeshifter (talk) 19:41, 27 August 2020 (UTC)

@Timeshifter: This will do it
COVID-19 pandemic death rates by country.
Updated December 22, 2024.
COVID-19 pandemic cases and mortality by country[1]
Country Deaths / million Deaths Cases
World[a] 886 7,078,473 777,025,779
Peru 6,601 220,994 4,528,708
Bulgaria 5,679 38,770 1,338,863
North Macedonia 5,428 9,990 352,060
Bosnia and Herzegovina 5,118 16,404 404,053
Hungary 5,071 49,113 2,237,196
Croatia 4,806 18,781 1,352,244
Slovenia 4,686 9,914 1,360,799
Georgia 4,519 17,151 1,864,383
Montenegro 4,317 2,654 251,280
Czech Republic 4,099 43,758 4,822,554
Moldova 4,040 12,283 650,808
Latvia 3,973 7,475 977,765
Slovakia 3,884 21,262 1,885,292
Greece 3,822 39,799 5,745,103
San Marino 3,693 126 25,292
Romania 3,597 68,945 3,567,265
United States 3,541 1,209,547 103,436,829
Lithuania 3,500 9,862 1,417,828
United Kingdom 3,404 232,112 25,019,756
Brazil 3,338 702,116 37,511,921
Italy 3,313 197,542 26,826,486
Chile 3,298 64,497 5,407,797
Martinique 3,159 1,104 230,354
Poland 3,151 120,962 6,766,496
Armenia 3,047 8,779 453,040
Gibraltar 3,002 113 20,550
Belgium 2,949 34,339 4,892,342
Paraguay 2,940 19,880 735,759
Trinidad and Tobago 2,934 4,390 191,496
Argentina 2,878 130,721 10,110,138
European Union[b] 2,822 1,266,374 186,318,205
Portugal 2,790 29,071 5,670,137
Russia 2,774 403,875 24,738,306
Colombia 2,758 142,727 6,394,609
Aruba 2,708 292 44,224
Sweden 2,694 28,259 2,768,898
Ukraine 2,677 109,925 5,541,377
Serbia 2,658 18,057 2,583,470
Guadeloupe 2,653 1,021 203,235
France 2,615 168,122 39,008,711
Mexico 2,603 334,810 7,622,467
Spain 2,547 121,852 13,980,340
Bermuda 2,547 165 18,860
Guam 2,536 419 52,287
Austria 2,485 22,534 6,082,991
Tunisia 2,427 29,423 1,153,361
French Polynesia 2,318 650 79,451
Saint Lucia 2,293 410 30,231
Uruguay 2,268 7,691 1,042,301
Liechtenstein 2,262 89 21,611
Suriname 2,256 1,406 82,504
Estonia 2,220 2,998 613,303
Malta 2,209 1,167 123,577
Sint Maarten 2,182 92 11,051
Bahamas 2,135 849 39,127
Barbados 2,100 593 108,836
Germany 2,080 174,979 38,437,756
Finland 2,058 11,466 1,499,712
Grenada 2,035 238 19,693
Ecuador 2,022 36,055 1,078,897
Andorra 1,994 159 48,015
Panama 1,989 8,756 1,044,987
Republic of Ireland 1,939 9,909 1,751,577
Lebanon 1,905 10,947 1,239,904
Kosovo 1,869 3,212 274,279
Bolivia 1,853 22,387 1,212,156
Costa Rica 1,844 9,374 1,235,806
Puerto Rico 1,832 5,938 1,252,713
Hong Kong 1,798 13,466 2,876,106
Montserrat 1,787 8 1,403
Monaco 1,720 67 17,181
Belize 1,708 688 71,430
Denmark 1,696 10,012 3,444,552
British Virgin Islands 1,669 64 7,643
Curaçao 1,645 305 45,883
South Africa 1,644 102,595 4,072,837
Iran 1,640 146,837 7,627,863
Switzerland 1,611 14,170 4,473,404
Cyprus 1,591 1,497 709,396
Collectivity of Saint Martin 1,591 46 12,324
Guyana 1,584 1,302 74,492
Antigua and Barbuda 1,572 146 9,106
Jersey 1,555 161 66,391
Luxembourg 1,530 1,000 396,576
United States Virgin Islands 1,525 132 25,389
Caribbean Netherlands 1,430 41 11,922
Canada 1,424 55,282 4,819,055
Namibia 1,422 4,110 172,556
Israel 1,395 12,707 4,841,558
French Guiana 1,384 413 98,041
Isle of Man 1,378 116 38,008
Seychelles 1,370 172 51,892
Netherlands 1,283 22,986 8,640,446
Albania 1,275 3,608 337,196
Jamaica 1,274 3,619 157,343
Jordan 1,254 14,122 1,746,997
Saint Vincent and the Grenadines 1,214 124 9,674
Eswatini 1,170 1,427 75,356
Turkey 1,164 101,419 17,004,712
Botswana 1,148 2,801 330,696
Guatemala 1,131 20,203 1,250,394
Dominica 1,106 74 16,047
New Caledonia 1,093 314 80,203
Malaysia 1,076 37,351 5,325,669
Palestine 1,075 5,708 703,228
Honduras 1,062 11,114 472,911
Réunion 1,056 921 494,595
Guernsey 1,051 67 35,326
Norway 1,050 5,732 1,529,801
Azerbaijan 1,005 10,353 836,492
Bahrain 1,001 1,536 696,614
Saint Kitts and Nevis 984 46 6,607
Oman 978 4,628 399,449
Australia 963 25,236 11,861,161
Fiji 962 885 69,047
Kazakhstan 951 19,072 1,504,370
Libya 891 6,437 507,269
Northern Mariana Islands 889 41 14,985
New Zealand 873 4,483 2,660,355
Turks and Caicos Islands 872 40 6,833
Anguilla 844 12 3,904
Mauritius 841 1,074 329,294
Cabo Verde 802 417 64,474
Wallis and Futuna 782 9 3,760
Belarus 775 7,118 994,045
Cuba 771 8,530 1,113,662
Sri Lanka 740 16,907 672,812
Taiwan 739 17,672 9,970,937
American Samoa 702 34 8,359
South Korea 693 35,934 34,571,873
El Salvador 673 4,230 201,965
Mongolia 630 2,136 1,011,489
Mayotte 612 187 42,027
Maldives 602 316 186,694
Japan 597 74,694 33,803,572
Philippines 586 66,864 4,173,631
Indonesia 581 162,059 6,829,949
Federated States of Micronesia 579 65 31,765
Iraq 575 25,375 2,465,545
Palau 562 10 6,372
Kuwait 559 2,570 667,290
Faroe Islands 518 28 34,658
Cayman Islands 516 37 31,472
Iceland 489 186 210,722
Thailand 484 34,741 4,806,280
Saint Barthélemy 456 5 5,507
Morocco 436 16,305 1,279,115
Vietnam 433 43,206 11,624,000
Marshall Islands 424 17 16,297
Nepal 404 12,031 1,003,450
Brunei 399 182 349,830
Dominican Republic 390 4,384 661,103
Greenland 374 21 11,971
India 374 533,658 45,044,521
Myanmar 362 19,494 643,238
Singapore 358 2,024 3,006,155
Zimbabwe 357 5,740 266,396
Sao Tome and Principe 353 80 6,771
Saint Pierre and Miquelon 347 2 3,426
Lesotho 310 709 36,138
Saudi Arabia 299 9,646 841,469
Solomon Islands 254 199 25,954
Qatar 238 690 514,524
United Arab Emirates 229 2,349 1,067,030
Egypt 220 24,830 516,023
Venezuela 207 5,856 552,695
Mauritania 204 997 63,879
Zambia 202 4,078 349,892
Afghanistan 197 7,998 235,214
Comoros 193 161 9,109
Kiribati 183 24 5,085
Cambodia 177 3,056 139,325
Bangladesh 174 29,499 2,051,516
Macau 174 121 3,514
Djibouti 166 189 15,690
Algeria 151 6,881 272,175
Kyrgyzstan 147 1,024 88,953
Samoa 144 31 17,057
Gambia 141 372 12,627
Syria 140 3,163 57,423
Cook Islands 135 2 7,375
Malawi 130 2,686 89,168
Gabon 126 307 49,056
Pakistan 125 30,656 1,580,631
Tonga 123 13 16,992
Senegal 111 1,972 89,316
Rwanda 107 1,468 133,266
Kenya 104 5,689 344,113
Sudan 102 5,046 63,993
Equatorial Guinea 101 183 17,130
Timor-Leste 100 138 23,460
Tuvalu 99 1 2,943
Laos 88 671 219,060
China[c] 85 122,388 99,381,370
Nauru 84 1 5,393
Guinea-Bissau 84 177 9,614
Uganda 76 3,632 172,159
Somalia 76 1,361 27,334
Haiti 74 860 34,690
Cameroon 71 1,974 125,279
Mozambique 68 2,252 233,845
Papua New Guinea 65 670 46,864
Republic of the Congo 64 389 25,234
Ethiopia 60 7,574 501,258
Yemen 56 2,159 11,945
Liberia 54 294 8,090
Angola 54 1,937 107,487
Madagascar 46 1,428 68,582
Vanuatu 44 14 12,019
Ghana 44 1,463 172,324
Nicaragua 36 245 16,196
Guinea 33 468 38,582
Mali 32 743 33,180
Togo 31 290 39,537
Eritrea 30 103 10,189
Uzbekistan 29 1,016 175,082
Ivory Coast 27 835 88,455
Bhutan 26 21 62,697
Central African Republic 22 113 15,443
Burkina Faso 17 400 22,160
Sierra Leone 15 126 7,985
Democratic Republic of the Congo 14 1,474 100,984
Nigeria 14 3,155 267,189
South Sudan 13 147 18,855
Tanzania 13 846 43,312
Niger 12 315 9,528
Tajikistan 12 125 17,786
Benin 11 163 28,036
Chad 10 194 7,702
Burundi 1 15 54,569
Vatican City 0 0 26
Niue 0 0 1,092
Falkland Islands 0 0 1,923
Saint Helena, Ascension and Tristan da Cunha 0 0 2,166
Pitcairn Islands 0 0 4
Tokelau 0 0 80
North Korea 0 0 0
Turkmenistan 0 0 0
  1. ^ Countries which do not report data for a column are not included in that column's world total.
  2. ^ Data on member states of the European Union are individually listed, but are also summed here for convenience. They are not double-counted in world totals.
  3. ^ Does not include special administrative regions (Hong Kong and Macau) or Taiwan.
Wikitext
{| class="wikitable mw-collapsible"
![[COVID-19 pandemic death rates by country]]. 
|-
|{{scrolling window|link=Template:COVID-19 pandemic death rates by country|height=150px|title=New articles}}
|}

References

  1. ^ Mathieu, Edouard; Ritchie, Hannah; Rodés-Guirao, Lucas; Appel, Cameron; Giattino, Charlie; Hasell, Joe; Macdonald, Bobbie; Dattani, Saloni; Beltekian, Diana; Ortiz-Ospina, Esteban; Roser, Max (2020–2024). "Coronavirus Pandemic (COVID-19)". Our World in Data. Retrieved 2024-12-22.
Unfortunately I may not have time to read through the discussion at present, gotta finish checking my watch list here and on meta, also multitasking with real world stuff. However, I'm fairly certain that the manual of style discourages this usage in articlespace. (please ping on reply)
𝒬𝔔 16:58, 28 August 2020 (UTC)
Thanks Quantocius_Quantotius. I added a link to Template:Scrolling window to Help:Table#Scrolling. I also added a link to Template:COVID-19 pandemic data which is one of the few scrolling tables I have seen in article space.
Is it possible with Template:Scrolling window to set it up with a link to fully expand a table? As with Template:COVID-19 pandemic data? And is it possible with Template:Scrolling window to fix the header row such that it stays visible while scrolling? As at Template:COVID-19 pandemic data.
I wish to know the minimal wikitext involved with Template:COVID-19 pandemic data to do those 2 things: Full expansion and fixed header. Template:COVID-19 pandemic data has so much wikitext. Can you pull out the basics and use it here with Template:COVID-19 pandemic death rates by country?
--Timeshifter (talk) 23:52, 28 August 2020 (UTC)
 Done, however review by a second set of eyes wouldn't hurt; I haven't really done serious css stuff for a few years now and I've managed to make a few (thankfully minor) errors in template coding in recent weeks. I took it a bit more slowly here to double check and I had a bit more time today but it's still possible I missed something.
Other than that let me know if there's any other features you want and I'll try to get to them before the end of the month. Courtesy ping to Dudley Miles since you're working on this as well.
I'm going to try to be around Sunday at least for 30 minutes if you have any immediate questions, if not you may need to wait until around the 21st to catch me again as the next two weeks should be bit busy for me, thanks. (please ping on reply)
𝒬𝔔 22:43, 4 September 2020 (UTC)
Thanks Quantocius Quantotius, but it is no longer necessary. See: User:Timeshifter/Sandbox119. --Timeshifter (talk) 01:18, 5 September 2020 (UTC)
An improved version is at Template:COVID-19 pandemic death rates. Does this look OK? Dudley Miles (talk) 08:36, 30 August 2020 (UTC)
It needs a collapse button that brings it back to the scrollable box. I asked for help here:
Template talk:COVID-19 pandemic data#Need a link to collapse it back to its original scroll box size.
Template talk:COVID-19 pandemic data/styles.css#Collapse link needed to collapse back to the original scroll box.
--Timeshifter (talk) 10:34, 30 August 2020 (UTC)

Comment. Dudley Miles and Quantocius Quantotius. Please see User:Timeshifter/Sandbox119. The scrollable table now has a sticky header row that stays visible while scrolling. --Timeshifter (talk) 01:26, 5 September 2020 (UTC)

Sticky header row problem has been solved. See:
Template:COVID-19 pandemic death rates
--Timeshifter (talk) 06:56, 6 September 2020 (UTC)
"Show all" and "Collapse" buttons are all working correctly on all of the partially-collapsed scrolling tables here:
COVID-19 pandemic by country and territory.
--Timeshifter (talk) 04:23, 29 October 2020 (UTC)

Help needed for a timeline of images

Hi, could a wiki table expert help us improve the Timeline of first images of Earth from space, please? There are more details in its Talk page. Thanks! fgnievinski (talk) 05:05, 30 November 2020 (UTC)

Sticky table headers?

Is there a way to make the first row of a table (the header) sticky? So that it stays on screen no matter which part of the table is on screen? Otherwise reading long (and wide) tables is really hard.

--Xerces8 (talk) 14:57, 11 April 2020 (UTC)

Google pulls up some Mediawiki info on it:
https://www.google.com/search?q=mediawiki+Sticky+table+headers
--Timeshifter (talk) 17:22, 11 April 2020 (UTC)
@Xerces8: See also: Phabricator request for floating table headers. --Timeshifter (talk) 08:51, 14 April 2020 (UTC)
@Xerces8 and Timeshifter: I just came here to request the same thing, following my post at Wikipedia talk:Reliable sources/Perennial sources/Archive 3#Technical idea: make the header row of the table sticky. This would be hugely useful for pages like that one. Someone seems to have figured out how to do it at Template:2019–20 coronavirus pandemic data, but that may have involved Herculean amounts of coding (I see they've defined their own custom CSS class, I think). Does anyone have the technical expertise to solve this and add some instructions to this help page, or should we go to WP:VPT? {{u|Sdkb}}talk 00:28, 22 April 2020 (UTC)
Maybe ask at Template talk:2019–20 coronavirus pandemic data. --Timeshifter (talk) 00:37, 22 April 2020 (UTC)
Take a look in Template:2019–20 coronavirus pandemic data/styles.css at .covid-sticky bits. Graeme Bartlett (talk) 12:17, 22 April 2020 (UTC)
Maybe Bawolff can help. --MarioGom (talk) 12:54, 22 April 2020 (UTC)
Generally this stuff isn't mediawiki specific, but works the same as on other websites. See https://developer.mozilla.org/en-US/docs/Web/CSS/position#Sticky_positioning for details on how position:sticky. That said, I'm not sure how to do sticky headers in a table that's not scrollable (using only css and no js). The Covid template works since the entire thing is in a scrollbox. I'm not fully up to date on recent CSS stuff, so maybe there's a method I am unaware of. Bawolff (talk) 01:11, 3 May 2020 (UTC)
GhostInTheMachine talk to me 10:45, 6 September 2020 (UTC)
This code will make the column headers and the row headers sticky. If there are no row headers, then omit the "left:-1px;" and "z-index:1;" styles from the first column header. It works in Chrome and Firefox browsers for Windows desktop and Android mobile devices.
{| class="wikitable" style="max-height:100vh; overflow:auto;"
|-
! scope="col" style="position:-webkit-sticky; position:sticky; top:-1px; left:-1px; z-index:1;" | StickyRowCol
! scope="col" style="position:-webkit-sticky; position:sticky; top:-1px;" | StickyCol
|-
! scope="row" style="position:-webkit-sticky; position:sticky; left:-1px;" | StickyRow
| data
|}
Example table
StickyRowCol StickyCol StickyCol StickyCol StickyCol StickyCol StickyCol StickyCol StickyCol
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
StickyRow data data data data data data data data
Jroberson108 (talk) 22:05, 4 December 2020 (UTC)
Jroberson108. Thanks! I linked to this talk page section from here:
meta:Community Wishlist Survey 2021/Reading/Enable sticky table headers
Feel free to add this collapsed example table to Help:Table.
--Timeshifter (talk) 21:15, 7 December 2020 (UTC)
Also linked from: meta:Community Wishlist Survey 2021/Mobile and apps/Improve horizontal scroll of tables. --Timeshifter (talk) 21:26, 7 December 2020 (UTC)
Timeshifter. I am currently looking into moving the styles to a CSS file to simplify it for users. I have to do more research on the right way to add the CSS file and see if it should have it's own help page. I have the CSS file on my local and it seems to be working well. I am planning on setting class="sticky-headers" on the table with an optional class="sticky-headers-colrow" on a column header that also needs to be row sticky. Jroberson108 (talk) 22:12, 7 December 2020 (UTC)

(unindent). Jroberson108. Does this work with sortable tables too?

Also, I found this sticky table linked from the Phabricator T42763 thread:

And this one with sortable columns:

And class="wikitable floatable-header" here :

--Timeshifter (talk) 03:47, 8 December 2020 (UTC)

Timeshifter. 1) Yes, it works with "sortable"; although, "sortable" doesn't work for mobile, at least on my phone. 2) The RHCP pages aren't using a table, but a chart table (de:Vorlage:Charttabelle), which looks like a table in a desktop browser, but changes in a mobile browser so that row data is displayed vertically as opposed to horizontally with the column headers listed at the top of the entire chart. In certain curcumstances, this might be a better responsive approach compared to a table; although, their header labels aren't sticky at the top and scroll out of view causing a potential disconnect with the data. 3) It looks like "floatable-header" takes a similar approach to what I did in making column headers sticky, but they didn't do anything with the row headers which scroll out of view causing a potential disconnect with the data. Also, their column headers aren't sticky on mobile, just desktop. Jroberson108 (talk) 04:37, 8 December 2020 (UTC)

Set table column width to 150px

Here's the code. Does anybody know how to set the width of column 3 to 150px? "width: 150px" for column 3 is in the code at the moment, but the browser ignores "width" and "max-width" in any column. The browser only obeys "min-width". I tried "table-layout: fixed", "word-wrap: break-word", and some other things, not having luck so far. Thanks. –Novem Linguae (talk) 16:43, 6 January 2021 (UTC)

Novem Linguae, if you look at the thread just above ("Use of em and % values in preference to px values"), you'll see Warning: Setting specific pixel sizes is deprecated, as it interferes with the ability of the browser to adjust content to suit the browser window, device size, user-end font size limits, and other constraints. It is strongly preferred to use relative sizes, in percentage or em values... Schazjmd (talk) 17:45, 6 January 2021 (UTC)
@Novem Linguae: The cells in column 3 use {{nowrap}}. This forces the column to be at least as wide as "People's Front for Democracy and Justice", so setting a smaller width has no effect. Browsers (at least my Firefox) will not respect a large width if it forces the table to be wider than the window, so setting a very large width in column 3 may have no affect unless the window is really wide or you zoom out a lot. On my screen at standard zoom this all means that width is effectively ignored in that particular column of that particular table. PrimeHunter (talk) 22:48, 6 January 2021 (UTC)
PrimeHunter, deleting {{nowrap}} worked perfectly. Thank you. –Novem Linguae (talk) 03:55, 9 January 2021 (UTC)

Showing extra info when clicking a cell

Is it possible to show more information when clicking a cell in the table? Barecode (talk) 20:27, 5 January 2021 (UTC)

It is Bad Form to have hidden content without a clear indication, but the cell could have extra, hidden content and a [show] button:
     
{| class="wikitable"
|+ Caption text
|-
| Example || Example || Example
|-
| Example
| Example
{{collapse top|bg="silver"|title=More ...}}
Lots more information
{{collapse bottom}}
| Example
|-
| Example || Example || Example
|}
Caption text
Example Example Example
Example Example
More ...

Lots more information

Example
Example Example Example
See {{Collapse top}} for more details — GhostInTheMachine talk to me 18:53, 11 January 2021 (UTC)

Use of em and % values in preference to px values

Hello people,

Under #HTML attributes in this article there is this advice:

Doesn't this mean the various examples in this article should comply with that advice?

I can go through and amend if there is no objection and someone can check what I do. But if someone else prefers to do it I won't object.  ;-)

Cheers, Simon – SCHolar44 🇦🇺 💬 at 11:57, 18 December 2020 (UTC)

SCHolar44, the column width section states Warning: Setting specific pixel sizes is deprecated, as it interferes with the ability of the browser to adjust content to suit the browser window, device size, user-end font size limits, and other constraints. It is strongly preferred to use relative sizes, in percentage or em values.. I came here to see if there was a recent discussion that mentioned it, because the page gives examples using pixel sizes. There's a post from several years ago asking about the same thing, so it's been since at least 2016, but I can't find a discussion that led to the decision. Anyway, I agree that the page should be cleaned up to only use examples that comply with the recommended/strongly preferred guidance. Schazjmd (talk) 14:56, 20 December 2020 (UTC)
Note: I posted about this conversation on Wikipedia_talk:Manual_of_Style/Tables to encourage more editors to weigh in. Schazjmd (talk) 15:21, 20 December 2020 (UTC)
In Firefox browser I frequently click the zoom buttons in one of the top toolbars to increase or decrease the text size. But I also have "Zoom text only" checked in View menu > Zoom.
So I would not want em values used for images, or border width, or border spacing, or margins, padding, etc.. In other words anything non-text related.
But em is fine by me for widths of columns and tables. Since that is related to text sizing. --Timeshifter (talk) 05:02, 3 January 2021 (UTC)
Many thanks, Schazjmd and Timeshifter. I've taken your comments on board. Cheers, Simon – SCHolar44 🇦🇺 💬 at 05:50, 6 January 2021 (UTC)
Dear colleagues,
I have gone through the article, as promised, with the following actions:
  • changed px values to em values (multiplication factor used: x0.077) wherever px values had been applied to content that was not text-related, i.e. images, border width, border spacing, margins, padding etc
  • changed em values to px where they had been applied to images, border width, border spacing, margins, padding etc
  • drafted a notice for the introduction to the article and updated the existing (upper) one in the section headed "HTML attributes".
I have pasted the amended article into one of my User pages. To see the changes, just copy the amended article, go into Edit mode in the Help:Table article, Select All and delete, paste in the amended article, click Show preview then Show changes. When you're finished, click on Cancel.
Two questions:
  • You'll see that in the first place where I have changed the specification to em values, in the code under the heading "Multiplication table", I have only changed to ems for the width value, not the height. However, I see the example under the heading "Width, height" specifies style="width: 60%; height: 14em;". Is there a reason to use em or % for the height?
  • Should we word the advice to indicate that % or em specifications are only needed for width values?
Please examine/critique carefully, and of course change at your will!
I look forward to seeing your comments. Cheers, Simon – SCHolar44 🇦🇺 💬 at 03:21, 18 January 2021 (UTC)
undent: Here is a diff.
changed em values to px where they had been applied to images, border width, border spacing, margins, padding etc This is the wrong direction. It's bad web design and Timeshifter's opinion on the particular matter is strictly his personal preference. The only thing that is reasonable is that images must be specified in pixel values (this is a web requirement, essentially). (I would also say it's generally not idiomatic to specify border widths in anything but pixels, but that's a question of idiom and not requirement or suggestion.)
Generally, what should be suggested is that inline styling in general should be avoided. class="wikitable" is usually sufficient. Where desired, inline styling should be kept to a minimum. This allows the particular skin in which the table is displayed, and the browser, and lastly the user with his own stylesheets whether onwiki or in his browser agent, maximum flexibility to do what it will to fit the content to the screen. --Izno (talk) 05:44, 18 January 2021 (UTC)
Hmm, I hear what you're saying, Izno. Your knowledge is obviously far in advance of mine; I don't have the background to implement explicitly what you have opined as over-arching principles. I have therefore decided not to carry this further and to delete my draft, knowing that your comparison is still available should anyone (or you) be interested to give clearer guidance on the px/em/% question. SCHolar44 🇦🇺 💬 at 11:22, 18 January 2021 (UTC)

tables for mobile editors

there would be appreciated some additional guidelines on table usage, for mobile editors..have posted a comment indicating some recent difficulties here Wikipedia:Village_pump_(technical)/Archive_187#wikitable_width..many thanks Gfigs (talk) 09:50, 29 January 2021 (UTC)

Collapsible Sections

Is there a way to make a table in which one row is collapsible and can be made visible by clicking [show] while other rows are always visible? Krisgabwoosh (talk) 20:33, 8 February 2021 (UTC)

parameters and auto-sorting tables

What do the 'create', 'order', 'numeric', and 'ascending'/'descending' parameters and more mean, how do they function, and how do I use 'colspan' and 'rowspan', and use multiple headers or place headers in different locations on Module:AutosortTable, and how do I auto-sort tables and use the 'create', 'order', 'numeric', and 'ascending'/'descending' and the other parameters on tables? -- PK2 (talk) 10:35, 19 August 2020 (UTC)

@PK2: Strictly speaking none of those are parameters. Modules follow the format of
{{#invoke: Module_name | function_name | arg1 | arg2 | arg3 ...}}
see mw:Extension:Scribunto for more details.
Hence, create is the name of the function being called; order, numeric, and descending (there is no ascending) are arguments.
Order is for the sorting preference it takes a coma separated list of column numbers; if two values are the same the next lower preference is used.
Numeric also accepts a coma separated list of column numbers; it designates which use numeric sorting.
Descending is likewise a coma separated list of column numbers it inverts the normal sort order which is ascending by default.
I'm not clear why you would want to use rowspan. Recalling that, post-sorting, any rowspanning cells are cut into individual rows with repeated content and remain that way even if the original sort order is restored.
You autosort tables by converting them into the format used by this module (see Module:AutosortTable/testcases for examples) although in most cases I suspect you're better off using a standard sortable wikitable.
I apologize if I haven't answered your question in full as I'm not sure I fully understood it; if you are looking for someone to write up the documentation for this module I can potentially do that but my time for this is quite limited at the moment (and I have quite a few things on my plate already) so it may be some time before I can get around to it.(please ping on reply)
𝒬𝔔 16:58, 28 August 2020 (UTC)
P.S. Please allow a few days for replies, I can usually respond within the week.
Hello @PK2: I don't know if you (or possibly others) still care, but I have (somewhat) updated the in-code documentation of the parameters you mentioned (while adding a couple of new items). I have an urge to create proper documentation, that's on an actual /doc page and isn't so terse, but I haven't done that yet (and it may be a while before I do).
In case you haven't already figured out what you were wondering about, take a look at what I've done and see if it helps. I'd welcome any feedback. Regards, — JohnFromPinckney (talk) 23:51, 21 February 2021 (UTC)

I have a few questions for everyone:

  1. Can you please make it possible for me to use parameters like 'colspan', 'rowspan', 'nosort' and 'data-sort-type', use multiple headers or place headers in different locations, style all or individual cells, rows, columns or headers, and replace the module equivalent of ! scope="row" with | scope="row" on Module:AutosortTable?
  2. How do I auto-sort tables and use the 'create', 'order', 'numeric' 'ascending'/'descending', 'hidden' and the other parameters, and style all headers or individual columns on standard tables?
  3. Why would someone use the 'hidden' parameter on tables?

Here is an example of a table:

Rank Wikipedia project Language Script WP
code
Active
users (log)
Launch date Logo
English name Native name
1 English Wikipedia English Latn en 5
Wikipedia logo showing "Wikipedia: The Free Encyclopedia" in
2 French Wikipedia Wikipédia en français French Latn fr 4
Wikipedia logo showing "Wikipedia: The Free Encyclopedia" in
3 German Wikipedia Deutschsprachige Wikipedia German Latn de 4
Wikipedia logo showing "Wikipedia: The Free Encyclopedia" in
4 Spanish Wikipedia Wikipedia en español Spanish Latn es 4
Wikipedia logo showing "Wikipedia: The Free Encyclopedia" in
5 Japanese Wikipedia ウィキペディア日本語版
(Wikipedia nihongo-ban)
Japanese Jpan ja 4
Wikipedia logo showing "Wikipedia: The Free Encyclopedia" in
Rank English name Native name Language Script WP
code
Active
users (log)
Launch date Logo
Wikipedia project

-- PK2 (talk) 08:36, 28 February 2021 (UTC)

Hi, PK2. Let me address your questions in order:
  1. I'm not personally inclined to add support for rowspan/colspan, as I'm not completely clear on what all their effects on accessibility are. More relevantly, how is a table supposed to be sorted when cells are joined using such span attributes? I don't think you need nosort for AutosortTable; just don't specify sorting on that column. The styling of rows and columns can be done now, if you only knew how (see my #2). And something (else) I don't know: why would you want to have | scope="row" in an accessible table?
  2. I guess your repeated question here is the answer I was waiting for from you: the documention I added is not sufficient to explain these parameters' use. Okay, I'll try to get up some time/energy and create a dedicated documentation page, with better examples.
  3. This one, I can help you on. Consider a table with different data columns (duh), one or more of which you do not (at the moment) want displayed on a given page (like maybe a list of all the Wikipedia versions, but without the magnitude of the user base displayed). However, you do want the table sorted by one of those hidden columns (for example, with EN-WP at the top, 'cause it's the biggest/has the most users).
That certainly is an example of a table. Um, what should we do with it? — JohnFromPinckney (talk) 15:36, 28 February 2021 (UTC)

Can you center a wikitable?

I see that you can center a normal table with align="center" in the heading, but this doesn't seem to affect wikitables. Are wikitables always left-justified? --DawnDusk (talk) 17:20, 4 March 2021 (UTC)

I found it. One must use style="1em auto 1em auto" to center it. I found this on the Simple Wikipedia's help page, actually - perhaps it's worth porting here? --DawnDusk (talk) 17:28, 4 March 2021 (UTC)

(unindent). This page is fairly up to date (November 10, 2020):

It says align="center" has been deprecated in HTML5.

It says to use CSS, and to set margin-left and margin-right values to "auto". Top and bottom margins can be set to whatever you want. Using your values, here is the short version:

style="margin:1em auto;"

1em is for top and bottom margins. Auto is for left and right margins.

Here it is added to the table from the insert table button on the editing toolbar:

Caption text
Header text Header text Header text
Example Example Example
Example Example Example
Example Example Example
{| class="wikitable" style="margin:1em auto;"
|+ Caption text
|-
! Header text !! Header text !! Header text
|-
| Example || Example || Example
|-
| Example || Example || Example
|-
| Example || Example || Example
|}

See also: Help:Table#Centering tables. It uses more specific CSS. Left and right margins only:

style="margin-left:auto; margin-right:auto;"

--Timeshifter (talk) 01:12, 5 March 2021 (UTC)

Help with a table

Is there some way I can get the table here to look better, thanks.--Prisencolin (talk) 06:17, 30 March 2021 (UTC)

Probably several. First (the question to always ask at the beginning): of what information is this a table? What "stuff" are you trying to show? For example, what does the "1.1" under the first "%" heading indicate? What are the percentages precentages of? (This question leads both to ideas about how to present the data and to formulating a caption, which this table lacks.)
Second: what is the connection between "Wan Chai", "Kwun Tong", and "Sha Tin"? They are all in the same table row, but why? If there is no connection, then I suspect you really need four separate tables, one each for HK Island, Kowloon, NT and "Islands" (although it seems that Hong Kong Island must be an island, no?). And what is the cell with the lonely little hyphen under "Islands"? — JohnFromPinckney (talk) 11:26, 30 March 2021 (UTC)
  1. The percentages next to each cell are indicating the percentage of the population which was recorded in the census to be able to speak Shanghainese.
  2. "Wan Chai", "Kwun Tong", and "Sha Tin" have no relation, hence why there isn't a header on the left side; they are just coincidentally next to each other. The chart is meant to be read top-down but I can see how it isn't obvious to some. Is there some easy way of making the divider between rows thicker?
  3. I believe "Islands" supposed to be Islands District, which is officially part of the New Territories region today, I'm not sure why my source has it as a separate region from the three other main regions, the other two being the main Hong Kong Island and Kowloon (which is physically connected to mainland China). The dash just shows that there are not subdivisions to be listed under "Islands".--Prisencolin (talk) 07:09, 31 March 2021 (UTC)
    First of all, I have to apologize for not knowing the proper divisions of Hong Kong; I am bewildered by what my quick web browsing has turned up regarding geopolitical divisions. Even Wikipedia does not make clear for me (skimming hurriedly) what the three "things" (Hong Kong Island, Kowloon, New Territories) are: regions, districts, areas, ...? There appears to be an island and a peninsula, but I'm not clear what's what, so you will have to check for correctness. The "Sheung Wan", "Wan Chai", "Kwun Tong" items seem to be districts or parts of districts, so I've just sort of half-guessed and leave the details to you.
    So, then: I have taken the liberty of making a "live demonstration" of a starting proposal on the page itself (Permalink).
    – I split the data into three tables, per your point 2 above, one for each, um, region. The "Islands" column you had seemed so minimal, that I relegated the 0.5% to a note at the bottom, as there's not much to tabularize.
    – I added the wikicode appropriate for WP:ACCESS, with captions and scope attributes, and right-alignment for the percentages. The caption for the first table has <br /> tags as a small hack to nudge all three tables to have equally high (in line numbers) captions, for the appearance of tidiness. The three tables I have placed in columns (assuming a wide enough display) using {{Columns-start}}, which should responsively collapse for narrower displays (like phones).
    – The tables remain (now independently) sortable.
    – I also smushed the statistical stuff a little closer together, although I'm not sure how much it means to our readers there. You can, of, course revert all or some of my changes; I hope they constitute an improvement (or at least a learning/discussion opportunity), but do not have to be permanent. — JohnFromPinckney (talk) 16:54, 31 March 2021 (UTC)

Is rowspan broken?

See the example below. Hoover (left column) and Nixon (right column) should overlap.

Name President
J. Edgar Hoover Harry S. Truman
Dwight D. Eisenhower
John F. Kennedy
Richard Nixon
William Ruckelshaus

Jpers36 (talk) 18:56, 1 April 2021 (UTC)

Hoover can't get to Nixon because Ruckelshaus is in the way. Haldeman and Ehrlichman are being kind of obstructive, too. Heh, heh.
Seriously, how can Hoover span four rows, as you've specified, when you've said Ruckelshaus needs to be in there, too. Something has to give, and the compromise is that all cells remain inside the table. It's actually a reasonable fallback solution, considering how easy it is for humans to miscount rows. — JohnFromPinckney (talk) 20:45, 1 April 2021 (UTC)
Nixon has a rowspan of 2, providing space for both Hoover and Ruckelshaus. Jpers36 (talk) 20:55, 1 April 2021 (UTC)
Ah, sorry, I hadn't noticed that. And now I'm flummoxed, too. — JohnFromPinckney (talk) 21:03, 1 April 2021 (UTC)

Maybe this:

FBI Director President
J. Edgar Hoover
  • Harry S. Truman
  • Dwight D. Eisenhower
  • John F. Kennedy
  • Richard Nixon
William Ruckelshaus
  • Richard Nixon

Or this:

FBI Director President
J. Edgar Hoover
  • Harry S. Truman
  • Dwight D. Eisenhower
  • John F. Kennedy
J. Edgar Hoover
  • Richard Nixon
William Ruckelshaus

Is this what you wanted at first?:

FBI Director President
J. Edgar Hoover Harry S. Truman
Dwight D. Eisenhower
John F. Kennedy
J. Edgar Hoover Richard Nixon
William Ruckelshaus

Need some kind of invisibility powder to sprinkle on the border between the 2 Hoover cells. And need to sprinkle some on the second Hoover. --Timeshifter (talk) 06:30, 2 April 2021 (UTC)

Invisible borders would be bad here, e.g. giving wrong results for screen readers. rowspan is not broken but a row will usually render with height 0 if there is nothing to display in the row. You can force a minimum height on a cell with style="height: ...em;" Don't use px which varies too much between users. Below I used 3em on Nixon. It works for me but it may fail to overlap with Hoover if the Ruckelshaus row gets two lines. I don't know a general method which will always work. PrimeHunter (talk) 11:17, 2 April 2021 (UTC)
Name President
J. Edgar Hoover Harry S. Truman
Dwight D. Eisenhower
John F. Kennedy
Richard Nixon
William Ruckelshaus
I would still qualify that behavior as broken -- there is a use case where it's valuable to display such overlaps even if technically "there is nothing to display in the row". Additionally, in other cases which are equivalent to my eye the overlap does render. But your workaround does do the job. Thanks! Jpers36 (talk) 11:46, 2 April 2021 (UTC)
If it's "broken" then it's broken by html and not by MediaWiki. rowspan is html. Browsers only display table cells large enough to fit the content and specifications. It's the same outside wikis. PrimeHunter (talk) 15:03, 2 April 2021 (UTC)

Need converter of 2-letter state abbreviations to full names

Such a converter, or regular expression, would make editing some state list tables much easier. Here is an example:

I fully replaced the data for all years for the state overdose death rates and counts here:

Pivot table function (from LibreOffice Calc) made this full update of all years possible. See the rates sandbox for how-to info. See also:

State rates:

State death counts:

The most time-consuming problem was dealing with the 2-letter state abbreviations in the source csv file. See:

LibreOffice Calc put the pivot table in alphabetical order of those 2-letter abbreviations. But that is not the same order as the full state names.

So I had to manually move the rows around in the Visual Editor. Then I could paste just the data next to the column of full state names.

I need a converter for the csv text file or the mediawiki table. Maybe a regular expression I could use in the wikitext editing window source editor. --Timeshifter (talk) 13:06, 9 April 2021 (UTC)

Syntax for scope and style on same line

I've got a table where I want to specify style on the header lines. The table documentation says to use scope=col for headers. If I specify only scope or only style, everything seems to work. However, if I specify both, then it takes my style specification as header text, e.g., I get a column header of style="max-width:14em;" | Announced from

! scope="col" | Style=max-width:14em | Announced

Shmuel (Seymour J.) Metz Username:Chatul (talk) 01:37, 21 May 2021 (UTC)

Omit the piping symbol before "Style". — JohnFromPinckney (talk) 01:40, 21 May 2021 (UTC)

Thanks: that worked. My next problem is how to reduce the font size. I tried

{| class="wikitable collapsible collapsed"
|+ Product timeline by announcement date
|- style=font:size:80%
! scope="col" | Number
! scope="col" Style=max-width:14em | Announced
! scope="col" Style=max-width:9em  | LTR #
! scope="col" Style=max-width:14em | Available
! scope="col" Style=max-width:9em  | LTR #
! scope="col" Style=max-width:14em | Withdrawn
! scope="col" Style=max-width:9em  | LTR #
! scope="col"                      | Name
|-
| 5665-295
| Jun 7, 1983
| [https://www.ibm.com/common/ssi/ShowDoc.wss?docURL=/common/ssi/rep_ca/1/897/ENUS283-141/index.html&request_locale=en 283-141]
| Jun  1983
| 283-141
|
|
| MVS/370 Data Facility Product Release 1
|-
| 5664-167
|
|
|
|
| Dec 31, 1993
| [https://www.ibm.com/common/ssi/ShowDoc.wss?docURL=/common/ssi/rep_ca/0/897/ENUS292-320/index.html&request_locale=en 292-320]
| VM/SP
|-
|  5664-173
|
|
|
|
| Dec 31, 1993
| [https://www.ibm.com/common/ssi/ShowDoc.wss?docURL=/common/ssi/rep_ca/0/897/ENUS292-320/index.html&request_locale=en 292-320]
| VM/SP HPO
|-
| 5664-308
|
|
|
|
|
|
| VM/XA SP
|}

and got

Shmuel (Seymour J.) Metz Username:Chatul (talk) 02:14, 21 May 2021 (UTC)

I cleaned up your headers, and put the styling in the correct location. Also fixed a typo. No need for max-width when the text remains on one line.
{| class="wikitable collapsible collapsed" style=font-size:80%
|+ Product timeline by announcement date
|- 
! scope=col | Number
! scope=col | Announced
! scope=col | LTR #
! scope=col | Available
! scope=col | LTR #
! scope=col | Withdrawn
! scope=col | LTR #
! scope=col | Name
|-
You might want to increase the text size just for the top header line. And expose the column heads. Here are the changes:
{| class="wikitable sortable mw-datatable mw-collapsible mw-collapsed" style=font-size:80%
|-
! colspan=8 | <big>Product timeline by announcement date</big>
Product timeline by announcement date
Number Announced LTR # Available LTR # Withdrawn LTR # Name
5665-295 Jun 7, 1983 283-141 Jun 1983 283-141 MVS/370 Data Facility Product Release 1
5664-167 Dec 31, 1993 292-320 VM/SP
5664-173 Dec 31, 1993 292-320 VM/SP HPO
5664-308 VM/XA SP
--Timeshifter (talk) 06:28, 21 May 2021 (UTC)
Thanks: I used maxwidth to leave as much room as possible for the Name column; some of the product names are longer then the ones I posted here. I used "|+" more to keep "Hide" from going in a column header than from any real desire for a caption, especially since wiki formats the caption for a very narrow line width when the table is collapsed: I may see how it looks with a blank caption.
Is the purpose of the mw-foo to make the table sortable?
Does using a second header row instead of a caption change the metadata that wiki extracts from the markup? Shmuel (Seymour J.) Metz Username:Chatul (talk) 11:04, 21 May 2021 (UTC)
Don't know anything about metadata. The mw-foo is just what I have been using for collapsible tables. I think it is the more recent class for collapsible tables. See also: MW:Manual:Collapsible elements.
Your max-width settings were not effecting the columns with dates and numbers, because those dates, numbers, and headers were already short. So screen width will not effect them first. In fact the individual header words can not wordwrap. The wordwrap would occur between the word and the hash tag.
Before that happens the product name column would wrap.
I haven't figured out a way to spread out the caption of a collapsed table.
You could use my previous table that put the caption in a wide header. Then change the column headers to plain table cells. So they wouldn't show in the initial collapsed table:
Product timeline by announcement date.
Number Announced LTR # Available LTR # Withdrawn LTR # Name
5665-295 Jun 7, 1983 283-141 Jun 1983 283-141 MVS/370 Data Facility Product Release 1
5664-167 Dec 31, 1993 292-320 VM/SP
5664-173 Dec 31, 1993 292-320 VM/SP HPO
5664-308 VM/XA SP
--Timeshifter (talk) 13:39, 21 May 2021 (UTC)
(edit conflict)Firstly, 80% is too small; please don't use that. See MOS:SMALL / MOS:SMALLFONT for more.
Secondly, please don't use collapsed, as it, too, limits accessibility, as explained at MOS:DONTHIDE.
Thirdly, Timeshifter is right about max-width; you don't need it, and it's generally better to not constrain columns, because some user is going to come along with a different user-agent than you have and see things different than you do, anyway. In general, let the data determine the widths. In this case, the long product names will automatically consume as much space as available before breaking into multi-line display; I'd say that's exactly what you want.
And finally, Chatul, you were on a good path by using |+ as you did; tables usually should be captioned, and you've got a good caption to use. Try:
Product timeline by announcement date
Number Announced LTR # Available LTR # Withdrawn LTR # Name
5665-295 Jun 7, 1983 283-141 Jun 1983 283-141 MVS/370 Data Facility Product Release 1
5664-167 Dec 31, 1993 292-320 VM/SP
5664-173 Dec 31, 1993 292-320 VM/SP HPO
5664-308 VM/XA SP
Try this stuff out and see how it works for you. — JohnFromPinckney (talk) 13:39, 21 May 2021 (UTC)

(Unindent). Another possibility is to go ahead and collapse the table, but link to a page with the expanded table. This is done for some of the partially collapsed tables in this popular article (in the Statistics section):

"See COVID-19 pandemic deaths for expanded tables and more info."

I thought of a way to show just the table caption in spread out form. I had forgotten about class=nowrap for the caption only. You could even add a caption border and padding. The table still wordwraps as the browser window narrows.

Product timeline by announcement date.
Number Announced LTR # Available LTR # Withdrawn LTR # Name
5665-295 Jun 7, 1983 283-141 Jun 1983 283-141 MVS/370 Data Facility Product Release 1
5664-167 Dec 31, 1993 292-320 VM/SP
5664-173 Dec 31, 1993 292-320 VM/SP HPO
5664-308 VM/XA SP

--Timeshifter (talk) 14:31, 21 May 2021 (UTC)

For background, User:Chatul/References#Timeline is part of User:Chatul/References, which contains notes to myself that I may want to excerpt from when editing articles relating to, e.g., IBM software. It may be useful to others, but most likely only for copying text and markup. I would expect users of this material to only read enough to identify the material they want to excerpt. I tend to collapse tables there so as to not obscure other content. Shmuel (Seymour J.) Metz Username:Chatul (talk) 15:18, 21 May 2021 (UTC)
If you do some of this stuff on other wikis, then you may need to use style=white-space:nowrap to spread out the caption text when the table is initially collapsed. class=nowrap is not on all wikis. --Timeshifter (talk) 15:56, 21 May 2021 (UTC)
Thanks. I'll keep that in mind. Shmuel (Seymour J.) Metz Username:Chatul (talk) 18:34, 21 May 2021 (UTC)
You suggest again to go ahead and collapse the table, despite the accessibility problems I mentioned?
If you're going to hide the table anyway and point to another page for all the data, why not just omit the collapsed table completely and point to another page for all the data?
I don't believe partially collapsed tables pose an accessibility problem.
You thought of a way? I already included class=nowrap in my example above yours.
Chatul has since pointed out that their target is a user sub-page, where I think collapsed tables aren't quite so egregious (and I've got some collapsed-by-default content on my user page, so I'm no saint myself). I just wish to avoid recommending or condoning the use of content that some users cannot access. It certanly shouldn't be in mainspace articles. — JohnFromPinckney (talk) 16:30, 21 May 2021 (UTC)
I don't see an accessibilty issue for a user subpage with this use case. Putting the data on another page would make it more awkward to copy from multiple places.
I will be using class=nowrap. Shmuel (Seymour J.) Metz Username:Chatul (talk) 18:34, 21 May 2021 (UTC)

(unindent). John. You wrote: "I don't believe partially collapsed tables pose an accessibility problem." Is this official MOS policy? Can you show me where it says that? Do screen readers see the underlying table somehow because it is only partially collapsed instead of fully collapsed? If so, that is great. I will use more partially collapsed tables in articles. I can think of many cases where it would be useful. Actually I would like to see the references for this. I find the MOS to be out of date at times concerning access issues. John, I did not notice your use of nowrap before I thought of it. You need to reread WP:AGF. --Timeshifter (talk) 02:30, 22 May 2021 (UTC)

A little help

Hey, can I get a little help with a type of table I want to create? It's the inverse of the example on #Floating table. I've uploaded an example of what I need on imgur: https://i.imgur.com/esAYjjV.png. I'd also suggest someone put the answer in the main help page so other people who might not understand find it. Thank you. --81.196.174.24 (talk) 00:38, 12 June 2021 (UTC)

Nevermind, found the solution after some fiddling. Posting here in case someone needs it.
1 2 3 4 6 7
5
--81.196.174.24 (talk) 01:21, 12 June 2021 (UTC)
Looks like rowspan=2 is working for you. This below will work too if you don't want 2 separate cells for 4 and 5. It just puts a break between 4 and 5.
1 2 3 4
5
6 7
In rows where you have set the height (see Help:Table#Height) the text is centered vertically by default. You can align the text to the top or bottom via style=vertical-align:VALUE for the whole row, or for individual cells.
1 2 3 4 5 6 7
1 2 3 4 5 6 7
--Timeshifter (talk) 04:38, 12 June 2021 (UTC)
Thanks for the replies. No, I most definitely wanted two separate cells, I wanted 4 and 5 to be able to be sorted as different cells, in case I had several more instances in other rows of 4 and/or 5 and the readers wanted to sort either by 4 or by 5, if that makes sense. There's a reason I put "sortable" in my example.

Looks like rowspan=2 is working for you.

Ah, rowspan was the first thing i tried, I just didn't know how to get the 5 below the 4 without breaking the table. I would just put it next to the 4 in the code and it'd make a new column or something. --2A02:2F07:B10C:E300:7144:16E6:515C:6CA3 (talk) 11:14, 12 June 2021 (UTC)
While I'm here, I don't suppose there's a way to integrate that 4 next to the 5 in the table's code? For example, if I wanted to make this,
1 2 3 4 6 8 9
5 7
the code would be a mess. Isn't there any way to make a sortable table for what I want where the values are in their proper order in the code as well as on display? --2A02:2F07:B10C:E300:7144:16E6:515C:6CA3 (talk) 11:14, 12 June 2021 (UTC)
If you got it to work, then that must be the correct order in the wikitext. :)
class=sortable doesn't do anything unless there are some headers.
--Timeshifter (talk) 11:47, 12 June 2021 (UTC)

Side by side tables

In § Side by side tables, it instructs to add the html tag <ul> (unordered list), and further states that if the user wishes their tables to be fully left-aligned, to substitute <ul style="margin-left:0px;"> in place of the plain tag. Wouldn't the same no-indent result be achieved by omitting the UL tag entirely, or will there be some effect that's displayed when more that two tables are horizontally stacked? — CJDOS, Sheridan, OR (talk) 20:16, 26 May 2021 (UTC)

Can you demonstrate other options? --Timeshifter (talk) 13:38, 27 May 2021 (UTC)
The reason why I said what I did above, is because I was playing around with the idea of horizontally stacking two tables below a third table, and noticed that to my annoyance, the side by side tables were indented off the left margin. I eventually learned what the initialism UL meant in the html tag, and when I removed the Unordered List tag, my side by side tables aligned left without any indentation, exactly as I wanted. I ultimately didn't use side by side tables in what I was working on, but I thought maybe the Help:Table page needed an update. Give me some time to construct example tables here, and I'll have an demonstration for you. — CJDOS, Sheridan, OR (talk) 18:06, 27 May 2021 (UTC)
  • I made the bottom-left tables collapsible, because this was the layout is what I was working on, but otherwise is irrelevant to the concern raised.
Example A

Side by side tables, with Unordered List tag:

Year Africa Americas Asia & Pacific Europe
2014 2,300 8,950 9,325 4,200
2015 2,725 9,200 8,850 4,775
  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775
  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775

Notice in the above example, the left table is indented off the margin. The table directly above it which is not horizontally stacked, is not indented (for comparison of how it should look).

Example B

Side by side tables, without Unordered List tag:

Year Africa Americas Asia & Pacific Europe
2014 2,300 8,950 9,325 4,200
2015 2,725 9,200 8,850 4,775
  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775
  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775
  • In the above example, none of the tables have indentation, because I removed the <ul> tag. Help:Table currently suggests that to achieve this result, I should add <ul style="margin-left:0px;"> rather than removing the Unordered List tag entirely. I'm sure there's a reason why the Help page is written that way, but I wanted to inquire about this. — CJDOS, Sheridan, OR (talk) 18:29, 27 May 2021 (UTC)

    I should add that if I copied the relevant section of Help:Table as it is shown currently, the tags have line breaks between them, which I did not include here. If I had, then the side by side tables would have padding between them. The above examples is how I was doing it (without padding), and I didn't want the padding confused for margin indentation. — CJDOS, Sheridan, OR (talk) 18:36, 27 May 2021 (UTC)

    Simplifying so I can visualize this better. Cleaned up some formatting too. I added a space after the first instance of </li>

  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775
  • Year Africa Americas Asia & Pacific Europe
    2014 2,300 8,950 9,325 4,200
    2015 2,725 9,200 8,850 4,775
  • I don't know why <ul> was used in Help:Table.

    I did some more tests, and I see no reason to keep <ul> </ul>

    So I removed them from the side by side sections of Help:Table.

    I also removed <ul style="margin-left:0px;"> since it is now unnecessary. --Timeshifter (talk) 19:19, 27 May 2021 (UTC)

    @CJDOS and Timeshifter: The <ul> is there because it is required for valid HTML. List items (<li>) are children of lists (as the name should lead you to expect). Lists are marked up as <ul> (for unordered lists) or <ol> (for ordered lists). If you need links to Internet reference works beyond our own articles just say so and I can plunk 10 or 20 here pretty quickly; otherwise GIYF. Therefore, the ul elements you removed should be readded.

    Also, Timeshifter: please revert all of your unexplained removal of the quotation marks enclosing the property lists in the wikicode, like:

    • style="display: inline-table;"style=display:inline-table;
    • lang="html"lang=html
    • class="wikitable"class=wikitable
    • style="text-align:left"style=text-align:left
    • scope="col"scope=col and scope="row"scope=row

    etc. This is all invalid syntax and makes for a poor example when used on a help page. — JohnFromPinckney (talk / edits) 21:47, 27 May 2021 (UTC)

    The quotation marks are only necessary if there is a space that needs to be enclosed by the quotation marks.
    Wikitext is not HTML. So unless you can point to a problem caused by not having the <ul></ul> tags, then they are not needed.
    I looked at the example side by side tables and images in Help:Table. In Firefox, Chrome, and Edge. In both desktop and mobile view. I narrowed the browser windows until the tables and images wrapped to the next line. They are working perfectly. And better than before because there is no indentation. --Timeshifter (talk) 23:36, 27 May 2021 (UTC)
    Response to first two lines, originally from 23:22: I realize you don't care about anybody else but yourself and all you want to do is slap some code together that looks to you as though it works in your operating system on your device at your resolution, but as one of the ten most frequented websites in the world we owe it to our readers to provide exemplary code and explanations whenever we can. That means using correct semantics and syntax and trying to provide valid output usable for the greatest number of users. It means producing (or trying to produce) valid HTML, accessible content, responsive displays of information, etc.
    The lack of <ul> produces invalid HTML. I suggest you trying running your variant of the page through the validator at https://validator.w3.org/ and comparing the number of errors found with the version which uses elements and syntax correctly. There are errors either way, unfortunately, but a few more with the ul tags missing. I cannot point to a case where some nuclear power plant suffered a meltdown because quotation marks or <ul> were omitted; I do believe, however, that it is thoughtless to omit the usual details with the excuse that there's currently no space in some style attribute, and it's quite ridiculous, IMO, that you went out of your way to remove quotation marks in correctly formed code. We do our readers and other editors a disservice by showing "seems-to-work" code instead of giving them examples they can follow without problems.
    It is true that wikicode is not HTML, but by adhering to coding standards—other pages, and even other places on this same page, use scope="col", for example—we enhance readability and increase the chance of working/valid code (for all users), and reduce the amount of time that gets wasted when somebody tries to add a second property-value pair to a style attribute that doesn't work, because there were no quotation marks previously. Let's try to provide good, robust examples instead of (in case this is what you were aiming at) saving the space of a few quotation mark characters.
    Response to last line, from 23:36: Congratulations. I don't give a damn. I'm talking about valid code and clear examples, not whether you think it works perfectly on your machine at this time. Try to see past your own display boundaries. — JohnFromPinckney (talk / edits) 23:55, 27 May 2021 (UTC)
    Please do not edit other people's comments. It is against WP:TALK. I removed your comment from the middle of my comment. And please stop making personal attacks.
    There have been infrequent discussions about this over the years. And you are making the same mistake others have made. I have been editing this help page for years. Others try to insist that Wikipedia editors must use XHTML or HTML or XML. They are all wrong. Wikitext is not HTML, XHTML, nor XML.
    A space in a parameter value necessitates the use of quotes around the value. That is true also in HTML. Look it up. --Timeshifter (talk) 00:11, 28 May 2021 (UTC)
    And I have now removed your comment from the middle of my comment. In future, please try to leave your comments as they are once you've signed them. It's hard to know when you're "done" so that the rest of us are allowed to converse with you. I have readded your original timestamp to your original comment, to which my first response is aligned. My second response follows your later addendum, which still has the later timestamp.
    Please, please stop going on about how you are right because you have edited this page before. It is really off-putting, and proves nothing useful. I do not insist that editors must use XHTML (or HTML or XML); what I do want is (1) consistency and (2) valid HTML as output. Your refusal to recognize the fact that HTML requires <ul> as a parent for <li> is disheartening, especially when you say you have been editing this help page for years. Longevity isn't what's important here, correctness is. — JohnFromPinckney (talk / edits) 00:24, 2 June 2021 (UTC)
    I apologize: I did not intend to start a heated debate. I would recommend putting the article back the way it was before my inquiry, until this can be properly confirmed. I only noticed an issue with side by side tables being indented from the margin, and the solution that I came up with appeared to me to fix the problem without complicating it with more code. The crux of my question was if <ul> was there for a reason, despite what results I might have achieved on my own display by removing them. — CJDOS, Sheridan, OR (talk) 00:48, 28 May 2021 (UTC)
    No need to apologize. JohnFromPinckney makes comments around various table talk pages, and contributes both good and bad ideas. As we all do. But in this case he is flat wrong. --Timeshifter (talk) 01:00, 28 May 2021 (UTC)
    I agree with Timeshifter: you needn't apologize. (I disagree that I am flat [or contoured] wrong, but that's a separate matter.) In fact, there is a reason for <ul>, it's because it's part of valid HTML. I'm sorry I didn't get to answer your question sooner before Timeshifter became so active. I try not to cross paths with them, and was holding back. Not your fault. — JohnFromPinckney (talk / edits) 14:28, 28 May 2021 (UTC)
    I think we should make valid html but I suggest to simplify the coding for editors by hiding it away in three new templates {{Wrap tables begin}}, {{Wrap tables mid}}, {{Wrap tables end}}, instead of the complicated:
    <div><ul> <!-- The <div><ul><li> code displays tables side by side when window width allows it -->
    <li style="display: inline-table;">
    ...
    </li> <li style="display: inline-table;">
    ...
    </li>
    </ul></div>
    
    Editors know templates. The html may look scary to many, and it's easily broken by a poor edit. PrimeHunter (talk) 23:22, 15 June 2021 (UTC)

    That looks good, PrimeHunter.

    isaacl found a 3rd simple solution:

    <div style=display:inline-table>
    Total number of matches played in official competitions only.
    Player Matches Goals
    Guðmundur Hrafnkelsson 407 0
    Guðjón Valur Sigurðsson 364 1,875
    Total number of goals scored in official matches only.
    Player Goals Matches Average
    Guðjón Valur Sigurðsson 1,875 364 5.15
    Ólafur Stefánsson 1,570 330 4.76

    --Timeshifter (talk) 02:35, 16 June 2021 (UTC)

    Someone who uses a screen reader (Graham87) said that the div example works fine. See this talk diff.
    I updated the Help:Table sections on side by side tables and images.
    --Timeshifter (talk) 13:58, 17 June 2021 (UTC)

    plainrowheaders apparently not working

    "plainrowheaders" class which left-aligns the row headers and removes the bolding

    That's not happening here. — 𝐆𝐮𝐚𝐫𝐚𝐩𝐢𝐫𝐚𝐧𝐠𝐚  06:03, 1 July 2021 (UTC)

    It would if you used scope attribute properly. Replace the style=text-align:left with scope="row" on each row header (and while you're at it, add scope="col" to the column headers) and you'll get the results you want. — JohnFromPinckney (talk / edits) 20:09, 1 July 2021 (UTC)
    Aha! Right, thanks. — 𝐆𝐮𝐚𝐫𝐚𝐩𝐢𝐫𝐚𝐧𝐠𝐚  22:52, 1 July 2021 (UTC)
    And now a not-irrelevant question: is the "number" on that table the most important thing about each community area? Or is it the name? It seems that the names are treated as row headings, meaning they're the most important, but the numbers are in the first column, as if they should take precedence. I'm uninformed on the article's topic, but it appears to me that the numbers could (and should) be moved to the second column, with the row headers (<th> generated by ! and scope="row") applied to the first column, as readers (and some editors) expect. — JohnFromPinckney (talk / edits) 20:09, 1 July 2021 (UTC)
    I'm uninformed on the article's topic
    So am I. I'll leave it as it is then. — 𝐆𝐮𝐚𝐫𝐚𝐩𝐢𝐫𝐚𝐧𝐠𝐚  22:52, 1 July 2021 (UTC)

    Non-sortable column with vertical header

    How do we do this? I get a bunch of gibberish in the column header. From class="wikitable sortable", I get horizontal

    class = "nowrap" style="line-height:99%;vertical-align:bottom;padding:21px .4em .2em;background-position:50% .4em !important;min-width:0.875em;max-width:0.875em;width:0.875em;overflow:hidden;"

    above the vertical text that's supposed to be in the column header.

    For example,

    Number
    ABC[1]
    class="nowrap ts-vertical-header " style="" |
    XYZ[2]
    1 2 3
    3 2 1

    kwami (talk) 12:17, 6 August 2021 (UTC)

    @Kwamikagami: Never place a pipe before {{vert header}}. Omit |stp=1 in unsortable columns. Don't add class="unsortable" or any other class when {{vert header}} is used. It adds its own classes, overriding whatever is before it. PrimeHunter (talk) 12:33, 6 August 2021 (UTC)
    Number
    ABC[3]
    XYZ[4]
    1 2 3
    3 2 1

    References

    1. ^ ref1
    2. ^ ref2
    3. ^ ref1
    4. ^ ref2

    Thanks! I wasn't familiar with vert headers. — kwami (talk) 20:09, 6 August 2021 (UTC)

    Examples for mw-datatable

    Hello, I've notice that the mw-datatables are not working (they might be elsewhere, but just not in this article, I haven't checked yet — but I can't find what is wrong with the table in this article). Can someone else spot what is wrong? I'm using Firefox on Windows with the default legacy skin, by the way. Thanks. — Eric0892 (talk) 04:39, 13 August 2021 (UTC)

    I also tried using Chrome, but that also doesn't work. — Eric0892 (talk) 04:40, 13 August 2021 (UTC)
    Can you clarify what you mean by "not working" and "this article"? Are you talking about this section of Help:Table? In any case, do the notes about is not working in some skins and the phab tickets listed in that section relate to your "not working"? — JohnFromPinckney (talk / edits) 12:33, 13 August 2021 (UTC)
    The samples in that section are not working. As to the skins issue, I was always using the default skin and it did work a few days ago. I'll add that to the Phabricator issue. — Eric0892 (talk) 18:04, 13 August 2021 (UTC)

    wrong sort order between negative numbers differing in decimal places in wikitable sortable

    I've been sorting this table by the last column and there seems to be an issue with the decimal places in negative numbers- The ascending sort actually descends from negative 0.001 to negative 0.012 and then jumps to the positives. It does not seem to be connected to the "increase" and "decrease" macros. -- Theoprakt (talk) 09:20, 23 October 2021 (UTC)

    Items in the last column of that table use {{increase}} or {{decrease}} followed by a number. In the HTML source for the article, typical items look like this:
    <img alt="Increase" src=...> 0.021
    <img alt="Decrease" src=...> 0.004
    
    Sorting puts all the "Decrease" items together (before "Increase") then sorts by numbers. The fix would be very ugly and involve Help:Sorting#Specifying a sort key for a cell. Apart from the wikitext bloat, the really ugly feature is that each number would have to be duplicated which is a maintenance nightmare. Johnuniq (talk) 09:42, 23 October 2021 (UTC)
    Thank you. So the macros turn the sort to alphanumerical, which is why even after inserting minus signs the sort order is wrong. -- Theoprakt (talk) 10:38, 23 October 2021 (UTC)

    Missing border

    See the below default table:

    Caption text
    Header text Header text Header text
    Example Example Example
    Example Example Example
    Example Example Example

    Why is the border missing from the right side of the header? Rgrds. --Bison X (talk) 21:35, 28 October 2021 (UTC)

    I see that it is the default table from the insert table button on the editing toolbar.
    It looks fine to me. No missing borders. I am using Firefox on Windows 10 Pro.
    Looks fine in Chrome and Edge too.
    --Timeshifter (talk) 21:46, 28 October 2021 (UTC)
    I'm using Firefox on Windows 10. Do you see a border on the far right of the 3rd "Header text" phrase? Rgrds. --Bison X (talk) 21:55, 28 October 2021 (UTC)
    Bison X. I see a border on the far right of the 3rd "header text" cell.
    Maybe you have some personal CSS or JS messing things up. See:
    User:Timeshifter#JS and CSS_customization.
    Also, do you have the same problem in Chrome or Edge?
    I am looking at this on a desktop PC.
    --Timeshifter (talk) 22:03, 28 October 2021 (UTC)
    Ok, I tried Chrome & it looked fine. In firefox, the table is missing right border lines after all 3 of the "Header text" phrases & a border line between the "header text" & the rest of the table. I must need to download some updates unless others have the same problem. Thanks for troubleshooting for me. Rgrds. --Bison X (talk) 22:11, 28 October 2021 (UTC)
    Bison X. If that doesn't work, you might want to completely uninstall Firefox and all your addons. Then do a clean install of Firefox without addons. See if that works. Then add one addon at a time, and see if the problem shows up again. --Timeshifter (talk) 22:45, 28 October 2021 (UTC)
    @Timeshifter: I'm late to the party but it can happen in Firefox if you enable this at Special:Preferences#mw-prefsection-gadgets: Make headers of tables display as long as the table is in view, i.e. "sticky". MediaWiki talk:Gadget-StickyTableHeaders.css#Borders in sticky headers is possibly about it. The post doesn't clearly say which border problem it discusses so you may have to check with the poster ;-) PrimeHunter (talk) 03:51, 21 December 2021 (UTC)

    Bison X. See above PrimeHunter post.

    PrimeHunter. I just activated that preference and the internal header borders disappeared in the table in this thread. I am still using Firefox on Windows 10 Pro. See related problem:

    --Timeshifter (talk) 09:38, 21 December 2021 (UTC)

    I disabled that preference & the boarders appeared. Thank you for the solution. Rgrds. --Bison X (talk) 10:40, 21 December 2021 (UTC)

    Why is everything so complicated in Wikipedia

    Is there an external or internal tool that helps you visually create and edit tables (colors, alignment...) without having to be a programmer.

    Not just with tables but almost everything. --Omar.idma (talk) 19:08, 1 January 2022 (UTC)

    Omar.idma. I love the title of your post. :)
    I am in source mode. When I click the table icon (under Advanced) on the editing toolbar this is what shows up:
    {| class="wikitable"
    |+ Caption text
    |-
    ! Header text !! Header text !! Header text
    |-
    | Example || Example || Example
    |-
    | Example || Example || Example
    |-
    | Example || Example || Example
    |}
    
    This is what you get when you save it ("publish" button):
    Caption text
    Header text Header text Header text
    Example Example Example
    Example Example Example
    Example Example Example
    You can fill it in while in source mode. Or use the Visual Editor (VE). With VE you directly fill in the cells without having to fool around with wikitext.
    The Visual Editor is not available for use on discussion (talk) pages. You can experiment with it on your user page or user sandboxes. See the VE section at the end of Help:Table. VE makes it easy to add or delete rows or columns.
    Colors and alignment are more advanced. Let others do that until you get more familiar with the basics. --Timeshifter (talk) 23:15, 1 January 2022 (UTC)

    Help page nests tables

    This page says "nested tables should be avoided whenever possible" (Help:Table#Nested_tables), but implements nested tables for all the "Rendered result" parts of the page. This doesn't render nicely on smaller devices and should instead float under its "Wiki source" counterpart on smaller screens. You could instead use markup similar to this which is responsive:

    <ul>
      <li style="border: 2px solid rgb(0, 255, 0); display: inline-table; padding: 0.5em;">
        '''Wiki source'''
        {{Pre|<nowiki>...</nowiki>}}
      </li>
      <li style="border: 2px solid rgb(0, 255, 0); display: inline-table; padding: 0.5em;">
        '''Rendered result'''
        {| class="wikitable
        ...
        |}
      </li>
    </ul>

    Here is one example from the page redone to be responsive.

    • Wiki source
      {| class="wikitable"
      |+ The table's caption
      ! Column header 1
      ! Column header 2
      ! Column header 3
      |-
      ! Row header 1
      | Cell 2 || Cell 3
      |-
      ! Row header A
      | Cell B
      | Cell C
      |}
    • Rendered result
      The table's caption
      Column header 1 Column header 2 Column header 3
      Row header 1 Cell 2 Cell 3
      Row header A Cell B Cell C

    Jroberson108 (talk) 16:01, 7 January 2022 (UTC)


    Note: No indentation in this reply. To avoid problems.

    2 divs would work too. And there is no initial indentation. See:

    <div style="display:inline-table; border: 2px solid rgb(0, 255, 0); padding: 0.5em;">

    Wiki source

    {| class="wikitable"
    |+ The table's caption
    ! Column header 1
    ! Column header 2
    ! Column header 3
    |-
    ! Row header 1
    | Cell 2 || Cell 3
    |-
    ! Row header A
    | Cell B
    | Cell C
    |}
    

    Rendered result

    The table's caption
    Column header 1 Column header 2 Column header 3
    Row header 1 Cell 2 Cell 3
    Row header A Cell B Cell C
    --Timeshifter (talk) 20:41, 7 January 2022 (UTC)
    Yeah, that works a little better. Guess I missed that section of the page. Jroberson108 (talk) 23:25, 7 January 2022 (UTC)

    Suggested wishlist items

    There are several wishlist items this year that relate to tables, both for editors and readers. I particularly encourage folks to go support these:

    Cheers, {{u|Sdkb}}talk 22:58, 29 January 2022 (UTC)

    Hey Jroberson108 and Tol. The above may be of interest. --Timeshifter (talk) 08:12, 30 January 2022 (UTC)
    @Timeshifter: Yeah, I saw and updated [T42763] for sticky table headers. I may be mistaken, but votes at this point might be meaningless since votes are probably what created the phabricator tickets to begin with; although, it might bring more help for implementation. Jroberson108 (talk) 08:51, 30 January 2022 (UTC)
    @Jroberson108: Voting just started. See: meta:Community Wishlist Survey 2022. The team prioritizes what they work on partially by voting results. So it can bring in more people to work on T42763. --Timeshifter (talk) 09:30, 30 January 2022 (UTC)

    Wikidata integration?

    Is there any information on a possible Wikidata integration that this page is missing? Like, if an editor wants to create a comparison table of items of a same instance on Wikidata comparing certain statements?--Iara Ai (talk) 19:04, 12 January 2022 (UTC)

    The page is mostly about how to make tables, not where to get content to put in them. If you want a table dealing with Wikidata items, you will have to find out (for yourself, or with help somewhere else) and then put that info in a table (which this page is intended to help you with). — JohnFromPinckney (talk / edits) 02:19, 13 January 2022 (UTC)
    If anybody finds some how-to pages about Wikidata and tables, please share them here, and we can put links to them in Help:Table. --Timeshifter (talk) 02:48, 13 January 2022 (UTC)
    The main method I know is to use Module:Wikidata table which I helped to develop — Martin (MSGJ · talk) 11:39, 24 February 2022 (UTC)

    'class="wikitable floatright" ' fails

    How can I get the following table to floatright? 'class="wikitable floatright"' does not perform as I expected from reading this documentation:

    {| class="wikitable floatright" |- | || colspan="2" | [[File:Humility and arrogance.png|150px|center]] |- | || colspan="2" | Humility and Arrogance |- | || How do you know that? || I know the truth. |- | In armed conflict || How can we protect ourselves without escalation? | Collateral damage is unfortunate but necessary. |}

    Humility and Arrogance
    How do you know that? I know the truth.
    In armed conflict How can we protect ourselves without escalation? Collateral damage is unfortunate but necessary.

    ALSO: Is there a way to specify imagesize in "em" units rather than pixels or "thumb"?

    The section on "Wikitable as image gallery" begins, "This section is still recommending deprecated fixed-pixel sizes for images, and should be updated with relative sizes in em units." Is there a way to replace, e.g., "150px" with a specification in "em units"?

    (And is "thumb" better than, e.g., "150px"?)

    Thanks, DavidMCEddy (talk) 05:48, 15 March 2022 (UTC)

    Trying to cleanup up this article right now... specifically at Nickelodeon Kids' Choice Awards#Locations and Nickelodeon Kids' Choice Awards#Ceremony hosts.

    I don't think we need one long table with 2 columns, creating excessive whitespace. What would be the best/preferred solution to this- splitting the tables in question into two separate tables (for example, two/three 2x17 tables) or keeping it as one table, but changing the amount of columns instead?

    In regards to the 'locations' table, I'm talking about something like this:

    Year Location Year Location Year Location
    1987 Rated K: For Kids by Kids studio 2004 Pauley Pavilion 2020 Virtual show
    1988 Universal Studios Hollywood 2005 2021 Barker Hangar
    1989 2006 2022
    1990 2007
    1991 N/A 2008
    1992 Universal Studios Hollywood 2009
    1994 Pantages Theatre
    Universal Studios Florida
    2010
    1995 Barker Hangar 2011 Galen Center
    1996 Universal Studios Hollywood 2012
    1997 Grand Olympic Auditorium 2013
    1998 Pauley Pavilion 2014
    1999 2015 The Forum
    2000 Hollywood Bowl 2016
    2001 Barker Hangar 2017 Galen Center
    2002 2018 The Forum
    2003 2019 Galen Center

    versus this:

    Year Location
    1987 Rated K: For Kids by Kids studio
    1988 Universal Studios Hollywood
    1989
    1990
    1991 N/A
    1992 Universal Studios Hollywood
    1994 Pantages Theatre
    Universal Studios Florida
    1995 Barker Hangar
    1996 Universal Studios Hollywood
    1997 Grand Olympic Auditorium
    1998 Pauley Pavilion
    1999
    2000 Hollywood Bowl
    2001 Barker Hangar
    2002
    2003
    Year Location
    2004 Pauley Pavilion
    2005
    2006
    2007
    2008
    2009
    2010
    2011 Galen Center
    2012
    2013
    2014
    2015 The Forum
    2016
    2017 Galen Center
    2018 The Forum
    2019 Galen Center
    2020 Virtual show
    Year Location
    2021 Barker Hangar
    2022

    Or is there some other alternate way(s) that might be even better? Thanks in advance. Magitroopa (talk) 22:49, 16 March 2022 (UTC)

    Your second set of years will work. From here:
    Help:Table#Side by side tables
    I don't know what else to do.
    --Timeshifter (talk) 23:21, 16 March 2022 (UTC)
    @Magitroopa: Per MOS:NO-TABLES, since the "Locations" table doesn't need sortable and the structure and data are simple (i.e. "year" is recognizable without label), you could convert it to a list and use Template:Columns-list to wrap it into columns. Not sure why 1994 has two locations?

    Locations:

    Alternatively, you could combine the "Locations" and "Ceremony hosts" tables.
    Year Location Host(s)
    1987 Rated K: For Kids by Kids studio Matt Nespole,
    Rebecca Schwager,
    Mark Shanahan
    1988 Universal Studios Hollywood Tony Danza,
    Debbie Gibson,
    Brian Robbins,
    Dan Schneider
    1989 Nicole Eggert,
    Wil Wheaton
    1990 Dave Coulier,
    Candace Cameron
    1991 N/A Corin Nemec
    1992 Universal Studios Hollywood Holly Robinson,
    Brian Austin Green,
    Tori Spelling
    1994 Pantages Theatre Joey Lawrence,
    Candace Cameron
    Universal Studios Florida Marc Weiner
    Jroberson108 (talk) 01:20, 17 March 2022 (UTC)
    @Jroberson108: I think combining the sections/tables might actually be best here, as opposed to the current two long tables. So maybe instead having a 'List of ceremonies' section followed by the table briefly started above, and then subsections within for 'Locations' and 'Host' that would give the prose text currently listed in those sections.
    And FYI in regards to two locations for the 1994 show- that's because the main show/ceremony was held at the Pantages Theatre with Lawrence & Cameron hosting, along with an east coast 'portion' from Universal Studios Flordia, which is where Weiner hosted from with an audience + some performances there as well. Magitroopa (talk) 01:30, 17 March 2022 (UTC)
    @Magitroopa: Based on the info you provided, I adjusted 1994 in the table above so it is apparent who hosted where. Also, commas now separate hosts since names can wrap in middle on small devices. Jroberson108 (talk) 01:55, 17 March 2022 (UTC)

    Why "Why <nowiki>"?

    The Nested Tables section says Why <nowiki>, seemingly out of a clear blue sky, and then doesn't say anything about <nowiki>. That apparently appeared in this June 13, 2020 edit but I'm not sure what it was intended to convey to the reader then or is intended to convey now. I came here to try to get a handle on hidden tables, and I am pretty foggy on the details of that even without wondering what I'm missing because of the Why <nowiki>. I looked at the wikitext around that in the current page version, which says:

    * Why <syntaxhighlight lang="moin" inline><nowiki/></syntaxhighlight>. <!-- Removing the <nowiki/> above to see. -->

    but that didn't help much. I tried removing the <nowiki> preceding that line and refreshing the page, but that didn't help either. Does this need to this be clarified, or am I just exceptionally dense this morning? Wtmitchell (talk) (earlier Boracay Bill) 10:11, 8 April 2022 (UTC)

    You're right, there was no need for it. In fact there was no need for that example at all. Nesting tables is discouraged, and there is a far simpler example beneath it which adequately explains the technique in case it was ever needed. --Jules (Mrjulesd) 15:52, 10 April 2022 (UTC)

    Remove the outlining of tables

    Hello!

    Can someone help me with this request? :) - Klein Muçi (talk) 15:16, 20 April 2022 (UTC)

    Not very easy. The styling for wikitables is:
    /**
    	 * wikitable class for skinning normal tables
    	 * keep in sync with commonPrint.css
    	 */
    	table.wikitable {
    		margin: 1em 1em 1em 0;
    		background-color: #f9f9f9;
    		border: 1px #aaa solid;
    		border-collapse: collapse;
    		color: black;
    	}
    	table.wikitable > tr > th,
    	table.wikitable > tr > td,
    	table.wikitable > * > tr > th,
    	table.wikitable > * > tr > td {
    		border: 1px #aaa solid;
    		padding: 0.2em;
    	}
    	table.wikitable > tr > th,
    	table.wikitable > * > tr > th {
    		background-color: #f2f2f2;
    		text-align: center;
    	}
    	table.wikitable > caption {
    		font-weight: bold;
    	}
    
    You could use a TemplateStyle to adjust this to how you like, and then apply it to your table.
    Otherwise you would have to use inline css for every element; very messy. Jules (Mrjulesd) 05:29, 21 April 2022 (UTC)
    @Mrjulesd, the problem is that I'm really bad with CSS editing so I wouldn't know how to do that in practice. :/ Is that an easy/fast thing to do? Maybe you can do it for me and I can save it somewhere? I just wanted to remove the frame (4 lines: top, bottom, left and right) that outlines the table while keeping everything else intact. - Klein Muçi (talk) 09:31, 21 April 2022 (UTC)

    Indenting nested tables is broken?

    What is wrong in the following example?

    Before table.

    Table 1
    cell 1
    Table 2
    cell 2

    After table. Should not be indented, but it is.

    How to make it work properly? — Mikhail Ryazanov (talk) 12:51, 2 January 2022 (UTC)

    (reply not indented to save confusion)
    One quick solution would be to add a third column on the left (with a fixed width) to provide the indent.
    Before table.

    Table 1
    cell 1
    Table 2
    cell 2

    After table. No longer indented — GhostInTheMachine talk to me 13:09, 2 January 2022 (UTC)

    Another simple fix would be to add <div>...</div> tags around the table.
    Before table.

    Table 1
    cell 1
    Table 2
    cell 2

    After table. — GhostInTheMachine talk to me 13:16, 2 January 2022 (UTC)

    Thanks! The second approach seems to be more adequate, since it uses "natural" indents instead of a hard-coded number (which might be different in different skins and might change in future).
    If this effect (demonstrated in my first example) is indeed a bug in the parser, maybe it should be investigated and repaired? At least, it would be very useful to mention such problems and workarounds in the help.
    And by the way, is there any reliable way to include tables in nested lists in general? For example, tables don't work "as is" even in simple bulleted lists:
    • Item before.
    • {| class="wikitable"

    ! Header |- | cell |}

    • Item after.
    I always struggle with this stuff (especially on discussion pages) and couldn't fine any clear solution... — Mikhail Ryazanov (talk) 13:48, 2 January 2022 (UTC)
    Thanks from me as well! Do we know exactly what causes the issue (e.g. whether it is the nested table)? If so, we could add this solution to Help:Table#Indenting tables. AlphaMikeOmega (talk) 16:46, 30 April 2022 (UTC)

    (This reply also not indented in attempt to avoid confusion)

    It seems that the wikiparser does not close off list items (<li></li> and <dd></dd>) after a table. That's why the After table. Should not be indented, but it is. in the OP's shaded bit is indented; it's (still) part of the <dl><dd> content initiated by the colon just before the table. I did some other tests with an HTML table (<table><caption> etc., not wikimarkup like {| class="wikitable") inside an asterisk-generated bulleted list, and the results were similar; my table appeared nicely, but everything following it (inside or outside my bullet list, including headings) was indented, as part of the identation accompanying the table's list item.

    For the basic question asked in the OP, I would consider just adding styling like {| class="wikitable" style="margin-left:4em" Introductory text.

    Caption text 2a
    Header text Header text Header text
    Example Example Example
    Example Example Example
    Example Example Example

    Concluding text. And I realize I'm not using nested tables as mentioned in the original question, as that aspect doesn't really seem germane; it's rather just the problem of a table in a list item.

    And as far as the later question goes, about putting a table in an unordered list, I was unable to make it work using asterisk markup, and didn't even try with your {| class="wikitable" coding; I got good results only by forcing the list-item closure by inserting the HTML directly (um, that is, both list markup and table markup, manually; click edit to see my code):

    I introduce this list of items, the third of which is a table.

    • Item 1
    • Item 2
    • Caption text 4
      Header text Header text Header text
      Example Example Example
      Example Example Example
      Example Example Example
    • Item 4

    And now some concluding text. Happily, it is NOT indented.

    Now, while this allows things to "work" on some discussion page, I can't say it's really practical.

    If this is a bug in the parser, I guess it should be reported on phab. Or maybe it's already there; I'll go have a look after this. — JohnFromPinckney (talk / edits) 00:49, 3 January 2022 (UTC)

    (This reply also not indented in attempt to avoid confusion)

    Mikhail Ryazanov. See: Help:Table#Nested tables. Nested tables are very confusing for screen reader users. A better solution is here:

    I removed the nesting. And instead of colon indentation I added the left margin to the first div styling:

    <div style="display:inline-table; margin-left:4em;">

    Before table.

    Table 1
    cell 1
    Table 2
    cell 2

    After table.

    Before table.
    
    <div style="display:inline-table; margin-left:4em;">
    {| class="wikitable"
    ! Table 1
    |-
    | cell 1
    |}
    </div> 
    <div style=display:inline-table>
    {| class="wikitable"
    ! Table 2
    |-
    | cell 2
    |}
    </div> 
    
    After table.
    

    As for a bulleted list with tables I did a Google search and found this thread:

    It agrees with JohnFromPinckney. --Timeshifter (talk) 04:10, 3 January 2022 (UTC)

    Need a bit of help

    Column 1 Column 2 Column 3 Column 4
    AA AB Column 5

    How can you make column 5 appear with the same height as the first 3 columns? I use "rowspan="2" but it would not work. I don't want that blank space on top of it. Thanks!--TerryAlex (talk) 19:47, 16 May 2022 (UTC)

    Do you mean like this?
    Column 1 Column 2 Column 3 Column 4 Column 5
    AA AB
    --Jules (Mrjulesd) 20:46, 16 May 2022 (UTC)
    Thanks!! :)--TerryAlex (talk) 21:54, 16 May 2022 (UTC)

    Indenting

    The advice on indenting tables is bad. A leading colon does not indent; rather, it produces a description list, but without a term, which results in invalid HTML. "The way you'd normally indent anything" is NOT by using a colon, but by using {{block indent}} or CSS. Trying to "indent" something in the middle of a list results in mangled HTML with lists opening and closing repeatedly, which is a disaster for accessibility. Hairy Dude (talk) 18:59, 17 May 2022 (UTC)

    Column wider for one row only?

    Hello, I'd like to create a table that looks like this:

    §page
    1Lorem ipsum chapter title42

    I.e. the title of the last column should extend to the left as much as it needs space even over the otherwise more narrow width of the column. To create the table above I've used the "colspan" attribute, but that means that the column title is no longer associated to the last column which I assume will be bad for screen readers. Do you have an idea how it would be possible to get the visual result without destroying the logical structure for screen readers? Thanks a lot in advance, --Marsupium (talk) 09:19, 7 June 2022 (UTC)

    @Marsupium: I don't think there is a proper way to do that. Alternatively you could use {{abbr}} like p. or {{Vertical header}}. You can use {{soft hyphen}} on long words with multiple syllables so a column can be rendered more narrow when needed. PrimeHunter (talk) 10:22, 7 June 2022 (UTC)
    Thanks for your answer! Using abbreviations isn't an option cuz the use case is the transcription of a book on Wikisource so should match the original, see here for a scan of the original. I've done some search on using a "scope" attribute and a workaround could be to use it and set the "dir" attribute of the table from right-to-left, but that sounds like a messy solution, so I guess I might simply have to live with the column remaining slightly wider than desired. :-) --Marsupium (talk) 10:44, 7 June 2022 (UTC)
    @Marsupium: This is a help page for the English Wikipedia. I meant no proper way here. Maybe Wikisource accepts more manipulation to try to follow source layout. You can try something like <div style="position: relative; right: 2em;">page</div>. The number can be varied. Don't use px, it relies too much on circumstances for the viewer. The suggested code can also depend on circumstances so you may want to test with different browsers, zoom levels and font sizes if you care about the precise result. PrimeHunter (talk) 11:25, 7 June 2022 (UTC)
    Sorry, I should've mentioned that the use case isn't here with the question! Thanks for the the position: relative workaround, it could indeed work. But I think now I've even found a clean solution using id and headers attributes as described by MOS:DTT#Complex tables. (Noting it here as reference for the next one running into a similar problem.) Thanks a lot again! --Marsupium (talk) 11:51, 7 June 2022 (UTC)

    How to "wrap" a table based on the device width?

    The following table (with {{football kit box}} templates inside each cell) looks fine on desktop view. However, on mobile view, horizontal scrolling is needed to view all the cells. I've been told that scrolling is discouraged. How can I fix the issue? Nehme1499 22:23, 14 June 2022 (UTC)

    Monza's first kit in 1912 was blue-and-white.
     
    In 1920 the kit changed to blue-and-white halves.
     
    The first red-and-white kit appeared in 1932.
     
    In 1937–38 and 1961–62, Monza wore stripes.
     
    Variations of a full-red shirt were worn between the 1930s and 2010s...
    ...which alternated with the white-stripe kit, first introduced in 1971.
    Answered at Wikipedia:Help desk#How to "wrap" a table based on the device width? (use Help:Table#Side by side tables). Please only post in one place. PrimeHunter (talk) 00:03, 15 June 2022 (UTC)
    My bad, I forgot to remove the topic here. Nehme1499 00:04, 15 June 2022 (UTC)

    Alternating row colors?

    This has seemingly never been resolved or addresses. Was this finally abandoned/rejected? Artem S. Tashkinov (talk) 20:00, 2 February 2022 (UTC)

    Artem S. Tashkinov. In the future please link directly to the talk section you are talking about. For example:
    Help talk:Table/Archive 4#Alternating row colors?
    I haven't been doing as much on Wikipedia, so I will not be of much help on this topic, but I thought I could at least make a more direct link. So others might be able to help more easily.
    --Timeshifter (talk) 10:27, 30 July 2022 (UTC)

    Row color

    How to make table where even rows has one color while odd — another? 94.25.160.245 (talk) 16:15, 27 July 2022 (UTC)

    Is this section higher up of relevance?:
    #Alternating row colors?
    --Timeshifter (talk) 10:30, 30 July 2022 (UTC)

    Request for table

    I was wondering how I could request help on creating a table that would look like this although where I do not have to input the spacing numbers?Patapsco913 (talk) 21:01, 22 August 2022 (UTC)

      Dixmoor / Riverdale
      Posen Riverdale / Dolton
      Markham   Dolton / Phoenix / South Holland
      Markham South Holland
      Markham / East Hazelcrest

    A workaround to have sticky/freeze headers to a scrollable wikitable.

    I made a workaround which handles the sticky headers issue, simply by using some easy to understand html and css code. I do not know if it works for any case (different browsers, various versions etc) but we can have a discuss here. You can make a wikitable with freezed header and a scrollable data body, by creating two tables, one exactly under the other, touching each other. The first will be bare, without data, just holding the header labels and the other will hold the data without having a header. The second should be kept within an html div, having a specific height (in my case 25em), which will add the scrolling effect. The two tables should be created in such a way that they should somehow be synchronized regarding their column widths, in order to give the illusion of being a single table. Put 0px margins between them and hide the first row's top border, to avoid the double line effect. You can try it by running the code below:

    (Note: I am not a web developer, some things may be  implemented  more efficiently, like making classes to avoid adjusting the column widths twice, but anyway...)
    
    ==Test Table==
    <div style="display:grid; grid-template-columns: auto;"> <!-- The main div -->
    
    <div style="width:100%;"> <!-- The div holding the header-only table -->
    
    {| class="wikitable" style="width:100%; margin-bottom: 0px; table-layout: fixed;"
    |+
    <!-- Give the desired names and widths to your labels -->
    !style="width:10%;"|Column 1 
    !style="width:20%;"|Column 2
    !style="width:30%;"|Column 3
    |}
    </div>
    
    <!-- The scrollable area. Set the  desired height here (eg 20em) -->
    <div style="height: 20em; overflow: auto;"> 
    
    {| class="wikitable" style="width: 100%; table-layout: fixed; margin: 0px; overflow-wrap: break-word; word-wrap: break-word; border-top-style: hidden;"
    <!-- Put the first table's column widths to the first row's cells (eg 10%,20%,30%) -->
    |style="width: 10%;"|Test  
    |style="width: 20%;" align="center"| col data 2
    |style="width: 30%;"|BIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| GBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |GBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell. DDDDDDDDDDDDDDDDDDDDDDDDDDDDDD
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data: MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |-
    |[[Test Data Col 1]]
    |align="center"| Test Cell Data col 2
    |[[Test Data Col 3. Can ne larger than the others.]]
    |}
     </div>
    </div> <!-- This part imforms the user that he/she can scroll. Copy it as it is -->
    {| class="wikitable" style="margin: 0px; background-color: white; width: 100%;"
    |align=center | scroll down to view all records ↕️
    |}
    </div>
    
    

    The result is:


    Column 1 Column 2 Column 3
    Test col data 2 BIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 GBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    GBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIGBIG Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell. DDDDDDDDDDDDDDDDDDDDDDDDDDDDDD Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data: MMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMMM.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    Test Data Col 1 Test Cell Data col 2 Test Data Col 3. Can ne larger than the others.
    scroll down to view all records ↕️

    Tsahmatsis (talk) 23:06, 8 September 2022 (UTC)

    Bug: heading hidden by table

    At 2022 Bahraini general election, if you set the page to the right width, the table completely covers the following section's heading. The text flows around the table but the heading does not. HLHJ (talk) 22:48, 13 November 2022 (UTC)

    The heading is "Candidates" and I see the problem. It looks like phab:T88220 from 2015 tried to fix it but was declined. Below is an example with a simple table only using class="floatright" and plain text. PrimeHunter (talk) 00:35, 14 November 2022 (UTC)
    Header Header Header Header Header Header Header Header Header Header
    Example Example Example Example Example Example Example Example Example Example
    Example Example Example Example Example Example Example Example Example Example
    Example Example Example Example Example Example Example Example Example Example
    Example Example Example Example Example Example Example Example Example Example
    Example Example Example Example Example Example Example Example Example Example

    Subheading 1

    Text under subheading 1.

    Subheading 2

    Text under subheading 2.

    Eliminating borders for last column

    I'm attempting to create a table with text to the right of the first and last rows. I attempted to use

    {| class="wikitable"
    |+ OS/360 storage layout after IPL and NIP
    |-
    ! Content
    ! Area 
    ! style="border-top: none border-right: none border-bottom: none" |
    |-
    | Link Pack Area (LPA)
    | style="text-align: center;" rowspan=2 | Common area
    | style="border-top: none border-right: none border-bottom: none" | Highest
    |-
    | Master Scheduler Region
    ! style="border-top: none border-right: none border-bottom: none" |
    |-
    |
    | style="text-align: center;" | Dynamic area
    ! style="border-top: none border-right: none border-bottom: none" |
    |-
    | System Queue Area (SQA) 
    | style="text-align: center;" rowspan=2 | Fixed area
    ! style="border-top: none border-right: none border-bottom: none" |
    |-
    | Nucleus 
    | style="border-top: none border-right: none border-bottom: none" | Lowest
    |}

    and got the results

    OS/360 storage layout after IPL and NIP
    Content Area
    Link Pack Area (LPA) Common area Highest
    Master Scheduler Region
    Dynamic area
    System Queue Area (SQA) Fixed area
    Nucleus Lowest

    How do I eliminate the borders and shading in the last column? Shmuel (Seymour J.) Metz Username:Chatul (talk) 10:31, 14 November 2022 (UTC)

    @Chatul: Below is my attempt which still has external borders. I don't know whether they can be hidden when class="wikitable" is used. Style attributes are separated by semicolons, not spaces. A cell starting with ! is a header cell. I see no reason for that in hidden cells. The three adjacent hidden cells can be combined with rowspan="3". background:white will usually be more like the page background than wikitable cells but it may depend on user settings. PrimeHunter (talk) 02:16, 15 November 2022 (UTC)
    OS/360 storage layout after IPL and NIP
    Content Area
    Link Pack Area (LPA) Common area Highest
    Master Scheduler Region
    Dynamic area
    System Queue Area (SQA) Fixed area
    Nucleus Lowest
    (The above is part of the edit by user:PrimeHunter .)
    I finally got this
    OS/360 storage layout after IPL and NIP
    Content Area
    Link Pack Area (LPA) Common area Highest
    Master Scheduler Region
    Dynamic area
    System Queue Area (SQA) Fixed area
    Nucleus Lowest
    by adding |style="background:white; border-top: none; border-right: none; border-bottom: none" to the {| (table start).
    NB: How do I get the rendering of {{para}} without the leading pipe symbol? --Shmuel (Seymour J.) Metz Username:Chatul (talk) 13:26, 15 November 2022 (UTC)
    Nicely done. The usual method to display code is to just wrap it in <code>...</code> like my first post. Special:ExpandTemplates shows that {{para}} does more but it usually doesn't matter. If the code includes wikitext which would normally be evaluated then also wrap it in <nowiki>...</nowiki> inside <code>...</code> like {{Citation needed|date=November 2022}} (see the wikitext). PrimeHunter (talk) 18:56, 15 November 2022 (UTC)
    Sorry, I had assumed that {{para}} and {{code}} (or <code>...</code>) produced distinct metadata.
    One last question, given a table like
    MVS/XA storage layout after IPL and NIP
    Content Area
    Extended AUK, LSQA and SWA Extended Private 2 GiB
    Rxtended User Region
    Extended CSA (ECSA) Extended Common
    PLPA/FLPA/MLPA
    Extended SQA (ESQA)
    Extended Nucleus 16 Mib
    Nucleus Common
    System Queue Area (SQA)
    PLPA/FLPA/MLPA
    Common Storage Area (CSA)
    AUK, LSQA and SWA Private
    User region
    System region 4 KiB
    Prefixed Storage Area (PSA) Common o
    Is it possible to position the text of a cell using position: relative in order to move 2 GiB up a line and 16 Mib down half a line in a manner that works on desktops, laptops and mobile devices? Or should I leave 16 MiB where it is and use a dummy row to position 2 GiB? --Shmuel (Seymour J.) Metz Username:Chatul (talk) 15:58, 16 November 2022 (UTC)

    Removing large gap in text before template

    I was looking at Template:United States presidential election results table header just now and noticed that the causes an unattractive gap in an article's text, as if there's an extra line break in the source (e.g.). Is there any way this template can be tweaked to remove the gap? (IMHO, I feel like this template should sit nicely in articles the same way images do.) I tried cleaning up the template myself, but to no avail.--Gen. Quon[Talk] 18:14, 15 November 2022 (UTC)

    @Gen. Quon: It appears to be deliberate. Reywas92 added a line break <br> after the table in [1]. PrimeHunter (talk) 02:48, 17 November 2022 (UTC)
    @PrimeHunter: Ah ha! That's what it is. @Reywas92: Is it OK that I removed that? The break as it existed was causing some very strange spacing issues.--Gen. Quon[Talk] 15:50, 17 November 2022 (UTC)
    Yeah I don't recall what issue I encountered that caused me to add it then. Reywas92Talk 23:19, 17 November 2022 (UTC)

    Scope in bottom row

    Is it WCAG-friendly to have |scope=col applied to the bottom row, like in this example, or is it better to use |-style="background:#EAECF0; font-weight:bold; text-align:center" in the line preceding it instead? Qwerty284651 (talk) 22:34, 10 December 2022 (UTC)

    @Qwerty284651: Repeating the column headers at the bottom of the table doesn't do anything to improve accessibility. If anything, it could cause some confusion for a person listening to a screen reader read the table. It's not a practice I would recommend doing, but most do it for visual purposes only because the table is tall and the top column headers scroll out of view when viewing the bottom of the table. They will sometimes repeat them in the middle of the table too. Jroberson108 (talk) 22:54, 10 December 2022 (UTC)
    So, it's best to apply a wikimarkup code, for e.g., |-style="background:#EAECF0; font-weight:bold; text-align:center", that mimics a look of a bolded bottom row like so:
    Titles Player Boc Dub Doh Ind Mia Cha Mad Ber Rom Can San Cin Phi Mos Tok Wuh Zur Bei Years
    intermediate text in table
    Titles Player Boc Dub Doh Ind Mia Cha Mad Ber Rom Can San Cin Phi Mos Tok Wuh Zur Bei Years
    whilst avoiding scope. Qwerty284651 (talk) 23:25, 10 December 2022 (UTC)
    @Qwerty284651: The column headers at the bottom of the table don't define any data under them, so they don't need the scope attribute. In essence, the bottom column headers aren't needed except for visual purposes. Jroberson108 (talk) 02:08, 11 December 2022 (UTC)
    @Jroberson108, can the first cell of the bottom row be treated as an indicator of a row and be used with scope="row" since it is a row, or treat it as a regular cell and use a pipe character | instead to not confuse screen reader users? Qwerty284651 (talk) 05:48, 11 December 2022 (UTC)
    @Qwerty284651: scope="row" doesn't indicate a row. It is used on a row header that defines the rest of the row's data. Ex. a player's name would be the row header followed by its data (height, wins, losses, etc.), and those row headers would be defined by a column header of "Player". This particular table you linked to doesn't focus on the players, but titles, so those are the row headers; although, the players might be better set as the row headers instead of the number of titles won since they are doing the winning. Basically it is a list of top title winners and the number, locations, and timeframe of their wins. As for the recommendation to "not confuse screen reader users", I would remove the bottom column headers all together. The table isn't that tall to begin with. The table above it is taller and doesn't repeat the column headers. Also consider moving the abbreviations from above the table to the top column headers with Template:Abbr. Jroberson108 (talk) 12:54, 11 December 2022 (UTC)

    How do I make the text align to the top of a row?

    I'm working on Universal City Zoo#Head trainers and I would like the text in every cell to start at the top left. (I'm going to move the biggest text blocks to their own articles but I'm not there yet.)

    What do I add? The top of my table currently looks like this:

    {| class="wikitable sortable mw-collapsible" |- !Years active at zoo !Name !Alternate names !Other info |-

    TIA! best, jengod (talk) 04:14, 22 December 2022 (UTC)

    Column alignment

    I have started a discussion about how to align a whole column without code in each cell: Wikipedia:Village pump (technical)#Column alignment. PrimeHunter (talk) 14:53, 13 December 2022 (UTC)

    Archived here:
    Wikipedia:Village pump (technical)/Archive 201#Column alignment
    --Timeshifter (talk) 11:36, 22 December 2022 (UTC)

    Table help

    Would it be possible to have a page, perhaps called "HELP:TABLE" that explained in English with examples how to have some columns of a table centred, but the first column aligned left, and also how to make a cell span two rows? The help pages are pretty rubbish across Wikipedia, but the Table page seems to have been written by the same people that wrote the manuals for DOS in the 1980s. I just cannot figure out how to align cells - the "align" text just appears in the cell - is it really necessary to specify this for every cell? Meanwhile trying to make a cell span two rows leads to an extra blank column appearing at the end of the table. I presum,e I'm wrongly guessing if the text should go after the "|" (or sometimes "||"). I avoid tables whenever I can, but unfortunately they are sometimes necessary, resulting in much wasted time. Thanks and Happy New Year. Davidelit (Talk) 08:04, 2 January 2023 (UTC)

    You are right. I moved the text alignment sections together just now. Now they need to be rewritten and clarified. And some more examples are needed. --Timeshifter (talk) 11:36, 2 January 2023 (UTC)

    Pixel heights and widths

    The text includes a warning: "Setting specific pixel sizes is deprecated... It is strongly preferred to use relative sizes, in percentage or em values." So why do all of the examples use pixels instead of percentages? 22:14, 21 January 2023 (UTC) Furius (talk) 22:14, 21 January 2023 (UTC)

    The full statement is: "Setting specific pixel sizes is deprecated, as it interferes with the ability of the browser to adjust content to suit the browser window, device size, user-end font size limits, and other constraints. It is strongly preferred to use relative sizes, in percentage or em values."
    The second sentence doesn't make sense. Em values will have similar problems. So will percentages.
    It is better to avoid column widths of all kinds, and let the browser window squeeze and narrow the table. At a certain point the table can not be narrowed further depending on the widest word or data in each column.
    Percentages will restrict narrowing of some columns.
    Better wording might be: ""Setting column widths is discouraged, as it interferes with the ability of the browser to adjust content to suit the browser window, device size, zoom settings, user-end font size choices, and other constraints."
    --Timeshifter (talk) 07:56, 23 January 2023 (UTC)
    That's a very different thing from the policy as I understand it. It is often necessary to control the relative width of columns / height of rows in a table, which is what all these methods do. Otherwise a single cell with substantial text may cause an entire row/column to be vastly expanded in an unhelpful manner. Pixels and em values assume that the user's window is of a particular pixel/em-width, which is why they are problematic. Percentages simply give relative dimensions, which the browser can then interpret within its own constraints. I don't see how this is a problem.
    Anyway, changing the policy would require an RfC. I'm simply saying that the examples which the page gives should match the policy as currently stated. Furius (talk) 13:30, 23 January 2023 (UTC)
    It's not a policy. Someone just wrote it up one day, and it has been pretty much ignored since then.
    From the top of Help:Table: "It is not one of Wikipedia's policies or guidelines".
    Picking one column to use 50% (or any percent) of the available width is going to be problematic as screen width narrows depending on the device.
    Anything that prevents the table from narrowing is a problem.
    Verbose notes columns are almost always a problem. Because people try to make them wider. Which then messes up the other columns. Notes columns should be avoided. Or the notes column should consist mainly of links to longer notes below the table.
    --Timeshifter (talk) 17:46, 23 January 2023 (UTC)