1247594 - Live sample code boxes need horizontal scrolling way too often

Status: RESOLVED WONTFIX

(developer.mozilla.org Graveyard :: Design, defect)

Description

[iamanubhavsaini]

:: Developer Documentation Request

      Request Type: Correction
     Gecko Version: unspecified
 Technical Contact: 

:: Details

I have seen this in JavaScript section where lines of code/comment tend to grow horizontally. Even at 73 characters or so, a horizontal bar appears which makes for a bad experience.

Take any page, say, https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/raw .

There are three main parts of a documentation page:
1. a contextual left-side bar.
2. a main content bar.
3. a right side in-this-article bar.

Due to 3-way partition of important on-screen real estate, content bar/column gets squished and thus horizontal bar appears.

Possible solutions:
1. Reduce the size of right side in-this-article bar/column. OR
2. Completely remove in-this-article and instead conditionally position fix (thus floating) in-this-article button. On clicking, it will fetch same list. For accessibility, put in-this-article box before article, and for user agents that have JS access, float it.

Comment 1

[Eric Shepherd [:sheppy]]

Yeah, this is a known issue that needs to be addressed. We have been debating possible solutions, including the ones you suggest (or similar).

I think this probably will be moved over to the MDN wiki platform bug list, but I'd like a second opinion, since it's at least hypothetically possible to resolve this in content.

Comment 2

[Eric Shepherd [:sheppy]]

Well, I don't see a bug for this in existence, so I'm making this a blocker for the live sample system meta bug.

Comment 3

[Florian Scholz (Open Web Docs)]

I think will be addressed once the TOC is not stealing horizontal space anymore.

Comment 4

[BMO Automation]

MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at https://github.com/mdn/sprints/issues/ and platform bugs at https://github.com/mdn/kuma/issues/.