Help:Lint errors/tidy-whitespace-bug

Problem

Tidy removes whitespace from an inner tag to an outer tag.

<span>a </span><span>b</span>

becomes

<span>a</span> <span>b</span>

after it goes through Tidy.

See how the whitespace character move from inside the span to outside it and now separates the two spans. This is a problem when the spans have CSS that affects whitespace. For example, when there is the CSS white-space property set on the elements.

<span style='white-space:nowrap'>a </span><span style='white-space:nowrap'>b</span>

becomes

<span style='white-space:nowrap'>a</span> <span style='white-space:nowrap'>b</span>

.

So, even if there are 30 spans in a row, since Tidy moves the whitespace, the browser can break rendering between spans. However, HTML5 parsers like Parsoid or RemexHTML will not move whitespace like this. So, there is no place for the browser to break the line since there is no whitespace between spans. This causes the row of spans to extend horizontally indefinitely.

Solution

This is most likely to affect on pages that have a list of entries. This usually comes from templates. So, editors will have to do what Tidy does by moving space around. One simple solution would be add a whitespace character after the span in the affected template like in this itwiki example which is used in w:it:Template:Campioni_NBA and which was rendering badly before this fix.

Tools

The following tools can help fix tidy whitespace bug:

• WPCleaner: see instructions on how to use WPCleaner for fixing errors detected by Linter. Tidy whitespace bug may be reported by WPCleaner as part of CheckWiki error #536.