The Table Cell `white-space: normal` on Explicit `width: auto` Quirk on IE/Edge
If an HTML document has no associated doctype (e.g. <!DOCTYPE html>
), it's in quirks mode.
Verify that by checking doctype or compatMode:
document.doctype === null;
document.compatMode === 'BackCompat';
Note: <meta http-equiv="X-UA-Compatible" content="IE=Edge">
won't change whether a document is in quirks mode.
For documents in quirks mode on IE/Edge, a table cell element (<th>
or <td>
) that has width: auto
set explicitly will always have its white-space
computed to normal
regardless of its set value even that has !important
specified.
We say "has width: auto
set explicitly" here because width
is auto
by default, while the quirk happens only when it's set explicitly.
Compare the following example on IE/Edge and another browser:
Source code of the example available here.
So the conclusion is that unless you want certain quirks mode behavior (not a good idea though), always include a valid doctype to put the document into no-quirks mode (standards mode) so that unexpected behavior won't get in the way.