Wikipedia:98 percent table width anomaly

The 98 percent table width anomaly is an issue of some tables (since 2008, as of May 2012) 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=". For "class=wikitable" the addition of style="margin-right:0" allows a table to fill the current width of the reader's window, and bypass the 98% width limitation.

Overwide wikitables

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 scrollbar (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

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 scrollbar (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

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 editors's bug is another editor'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

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.

Examples

The 2 wikitables below show the increased width, when the option is added to set: style="margin-right:0". This difference in width has occurred since 2008, and setting the margin is a reliable option to allow wider tables.

Format when class=wikitable:

This is a test of the default settings for a very wide table with much text to show the extent of the margins when enough data is present to push the table to its maximum width allowed by the table properties. A table with long text, or many wide columns, will expand to fit 98% of the width of the window. Again, this is the default width in this table.

Format when class=wikitable style="margin-right:0":

This is a test of style="margin-right:0" to override the default settings for an extra-wide table with much text to show the extent of the margins when enough data is present to push the table to its maximum width allowed by the table properties. A table with long text, or many wide columns, will expand to fit the full width (100%) of the window. Again, this is the width with style="margin-right:0".

See also

• WP:Advanced article editing
• WP:Advanced footnote formatting
• WP:Advanced table formatting
• WP:Advanced text formatting
• WP:Alert
• WP:Thinking outside the infobox
• WP:About translating German Wikipedia
• WP:Pruning article revisions
• WP:Overlink crisis
• WP:Authors of Wikipedia