What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 130 Stack Exchange communities.

I understand, from reading other Meta questions on this topic, that the StackOverflow administrators have good reasons for keeping the site to a fixed-width layout. However, one disadvantage of this layout that regularly frustrates me is the poor readability it imposes on code snippets. Horizontal scroll bars are a terrible thing, especially when trying to read code, when I often need to see both ends of the text at once (as opposed to letting my view flow from the end of one line to the beginning of the next). And unless the author of a StackOverflow post has been very careful to cut their code down to 80 characters per line, code blocks nearly always have horizontal scroll bars because the fixed width of the post column is so narrow.

The horizontal scroll bars are even more frustrating when I consider that I have a nice big 1920x1080 monitor that can easily display 256-character lines in my IDE, and yet I'm forced to view the code in a tiny window with scroll bars, surrounded by empty space.

Sure, I know that 80 characters is a standard width for formatting code, and StackOverflow is trying to discourage posting huge chunks of code, but some code snippets simply can't conform to that width even when reasonably-sized. In particular, code in Java, C#, and Objective-C tends to force the scroll bars to appear simply because standard type names, identifiers, and function signatures are very verbose.

Since most people these days have a wider monitor than the 1024-pixel width the StackOverflow layout was designed for, can the site somehow enable code snippets to use more of this width when the user desires it? Possibilities include:

  • Code blocks can "pop out" into a separate, resizeable browser window
  • Code blocks can temporarily (either with a toggle button or on-hover) expand dynamically to fill the width of the screen, pushing sidebar content out of the way if necessary
  • The user can reduce the font size of text in code blocks relative to other text on the site (this would allow more characters to fit in the same fixed-width column, and the user could then zoom-in the page to maintain the same effective text size).
  • The site has both the standard fixed width layout and a "wide" fixed width layout, where the "wide" layout is designed for at least 1440-pixel screen widths (yes, this is a much more heavy-weight solution).

EDIT:

I do not think this is a duplicate of View code in new window because that question is a request for one particular solution to this problem. I'm making a more general request for any solution to the problem, even if it isn't specifically "viewing code snippets in a new window."

share|improve this question
    
Edward, your suggestions have merit. Since your question was marked as a duplicate, would you consider adding the unique portions of your post as an answer on the linked one? –  George Cummins Jul 8 '13 at 23:31
2  
    
Another option would be to just automatically make it wider when there is space available, instead of leaving white space at the sides.... –  lnafziger Jul 9 '13 at 2:02
    
@lnafziger doubtful, this has been declined in the past. –  Aaron Bertrand Jul 9 '13 at 2:48
    
And somewhere, in those duplicates/related, there's a link to a script to do it client side. –  brasofilo Jul 9 '13 at 2:54

1 Answer 1

I edit a LOT of posts primarily to remove unnecessary horizontal scrollbars from code samples. It's not that hard to format code for a vertical layout; most people are just too lazy or indifferent to do so.

Also, as I use mobile more and more, making the code snippets even wider is not going to be very productive. As it is I have a very difficult time scrolling because the user or editor made it fit into the fixed space in a regular browser window, not thinking about how it would render on a mobile browser, or even a shrunken tablet-based "regular" browser.

Seriously, if you double the width of the code window, people will still continue to post horrible code samples devoid of any thought to carriage returns, skinny monitors or, quite frankly, any sort of readability at all. The real solution is to have people put a little more thought into the code samples they post, and there isn't a technical way to do that. There probably isn't a non-technical way to do that, either; these are the same people that publish code in their own environments with little or no thought put to formatting or readability.

share|improve this answer
    
Nice summary, my reading: Little or no thought put to formatting or readability, or just too lazy or indifferent to do so. –  brasofilo Jul 9 '13 at 2:52
    
I would think that a fair number of people posting wide code don't even think about mobile since they are posting from a computer. Perhaps a warning message explaining why it is better to post code that fits in the box if it is too wide would help inform people. –  lnafziger Jul 9 '13 at 3:24
1  
@lnafziger warning aside (which will also be discarded as an annoyance and probably difficult to implement) but do you think they are more likely to think about it if you make the code area wider or make it customizable? There will still be people with skinnier monitors than them (or with different options if customizable), even if you completely forget about mobile. –  Aaron Bertrand Jul 9 '13 at 3:28
    
I was actually agreeing with you, and offering a possibility to help with the problem as it is.... So no, I don't think that it will help if you make the code area wider. :) (After reading your answer, it helped me to reconsider my original support of the idea.) –  lnafziger Jul 9 '13 at 3:29
    
@lnafziger right, I'm saying that even with the warning, if people on a big monitor are putting code in a wide code area and it looks fine to them on their big monitor, they'll dismiss the warning because "works on my machine." –  Aaron Bertrand Jul 9 '13 at 3:31
    
I would think that at least some of them would pause and say "hey, that would be nice..." and fix it, especially if it was past 80 characters and they had to scroll on their monitor (no matter how big it is). –  lnafziger Jul 9 '13 at 3:32
    
This answer is very naive, and ranty. I go to a lot of trouble to format my code nicely, but it is sometimes better to use more than 80 characters. I suspect you write ugly code :) –  Carl Smith Jul 9 '13 at 17:24
    
@Carl how is it naïve? And are you saying that scrolling horizontally is somehow better than scrolling vertically? –  Aaron Bertrand Jul 9 '13 at 17:26
2  
Nope. I'm saying using more than 80 chars, like GitHub Gists allow for, is normal, and it does not mean that people format their code badly at all. I'm suggesting allowing more chars on the site, not going around editing other people's code because the site is too narrow to display it nicely. –  Carl Smith Jul 9 '13 at 17:31
    
@CarlSmith unfortunately we are limited on this network by other factors than whether you like longer lines of code or not. –  Aaron Bertrand Jul 9 '13 at 17:32
1  
It's not a case of like, so much as need, insofar as I need my code to read as easily as possible. –  Carl Smith Jul 9 '13 at 17:34
    
@CarlSmith well I don't know what kind of code you write or how much need is actually relevant on a volunteer site where you're reading other people's code for the most part, but if you think carriage returns make code less readable I'm afraid you're going to be in the minority in a lot of circles. –  Aaron Bertrand Jul 9 '13 at 17:35
    
What's wrong with a button to open the code in a pop out? Surely this would be an easy feature to add, and has no effect on the existing CSS. Some method names in PyObjC are more than 80 characters. I'm pretty sure a newline in a method name will suck. –  Carl Smith Jul 9 '13 at 17:36
    
    
let us continue this discussion in chat –  Carl Smith Jul 9 '13 at 17:38

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .