Wikipedia:98 percent table width anomaly

This essay, WP:98 percent table width anomaly addresses the issue of some tables (since 2008, still in September 2010), with class=wikitable or class=infobox triggering the bottom scroll bar when width is set above 98%. The over-wide display has been caused by automatic extra-margin padding, as either: wider margin-right for class=wikitable, or wider margin-left for infoboxes. This issue is about the top-level tables on a page, not about tables (with width=100%) inside other tables. Perhaps the full-name of the essay could be: "98-percent table-width anomaly triggering bottom scroll-bars for top-level, CSS-class tables". The problem does not occur for other tables, without the keyword "class=".

Overwide wikitables

change

Normally, a plain table (with no "class=") can be sized to any width up to "100%" without triggering a bottom scrollbar. However, the styles for "class=wikitable" or "wikitable sortable" have added an implicit right-side margin-right padding that fits okay up to 98% width. When sized to 99% or 100%, those class=wikitable formats have triggered a bottom scollbar (since 2008, as of June 2009), appearing along the bottom of the window. To avoid this situation, use:

class=wikitable   style="width:99%; margin-right:0"

The option for "margin-right:0" removes the right-side margin padding outside the box, rather than having a margin of 1em or 20px, or such.

Note that a full-screen table of width=101% (or higher), always triggers a bottom scrollbar, as expected, because 101%>100 (the full window width).

Overwide infoboxes

change

Normally, a plain box table (with no "class=") can be sized to any width up to "100%" without triggering a bottom scrollbar. However, the various styles for "class=infobox" add an implicit left-side margin-left padding that fits okay up to 98% width. When sized to 99% or 100%, those class=infobox formats have triggered a bottom scollbar (since 2008, as of March 2009), appearing along the bottom of the window. To avoid this situation, use:

class=infobox   style="width:99%; margin-left:0"

The option for "margin-left:0" removes the left-side margin padding outside the infobox, rather than having a margin of 1em or 20px, or such.

Anomaly versus bug

change

Although some might wish to consider the default limitation of CSS-class tables (to width=98%) as a bug, when tables are nested within other tables, then a wikitable of 100%-width will still add the same right-side padding as at width 50%, 80% or 98%. The problem of over-wide tables occurs at the top level, when 100% is the entire window, with no "outside space" to have padded. Because of the relative viewpoint, the situation is termed an "anomaly". One man's bug is another man's "clever feature" when the padding is added inside other tables, when formatting a table-within-a-table, etc.

The issue of determining "top-level tables" is complicated by the use of templates: a table coded inside a template might seem to be a top-level table. However, if the template were invoked inside an outer table, then the result would generate nested tables. Instead, the table padding generated by the template is the same, whether viewing the template in stand-alone mode, or when transcluded into another page. A similar complex issue is the use of subheaders ("==Subheader==") inside a template, and determining which page contains that labeled section for editing, because appearing on a formatted page does not mean the heading exists inside that page, just inside the template displayed for that page. These problems of nesting are related to side-effects of recursion.

Plain tables not affected

change

As a final reminder: The scrollbar problem only occurs for top-level tables in CSS classes, such as class=wikitable or class=infobox. A plain table (with no "class=") can be resized up to 100% without triggering a bottom scrollbar.

change
 

Many of those essays also apply to the full English Wikipedia.