Expanding local vars in technical 500 causes horizontal scrolling

[Keryn Knight]

Whilst working on a little alpha project to ​provide alternate error pages, and comparing output, I noticed that expanding the Local vars seems to always cause a horizontal scrollbar, at least at 1425x???? in Chrome.

As far as I can tell from checking out git tags, this seems to occur at least back to 2.2 (???? that can't be right, but OK!), and before that I start getting issues with code which has moved that my project doesn't support, so ... it may go back further.

A cursory play around with my devtools suggests that the following fixes it:

table.vars {
    margin: 5px 10px 2px 40px;
    width: auto;
}

Specifically:

• Restore the width to not be 100% (which is currently applied to all table) and use auto or inherit or initial instead.
• Add 10px right margin so the table lines up vertically with it's related context lines.

Attaching a gif which shows a slice of the issue.

[Keryn Knight]

animated gif showing the table's end being off-screen, forcing an horizontal scrollbar to appear when Local vars are toggled

[Hrushikesh Vaidya]

​PR

[Mariusz Felisiak]

Thanks for the report.

[GitHub <noreply@…>]

In 89d137f3:

Fixed #33457 -- Fixed "Local vars" scrolling in technical 500 debug page.

Thanks Keryn Knight for the report and the initial patch.