30

Every time I post a question of sufficient length, I need to scroll down past the editor in order to see my question's preview. It might be more effective if the question and preview were side-by-side so you could see both at the same time. When you can't see both at the same time, it almost defeats the purpose of having the preview update in real time. I'd almost prefer a whole separate page.

Would this require a significant refactoring of the entire question page? Probably, but I think it would be well worth it.

Improve this question
7
  • 3
    Will this feature ever see light? With most computers having widescreen monitors, the screen space is wasted while I have to scroll up and down to check the preview when creating or editing questions or answers. The side-by-side view when editing should be a standard option available to all users, not a user-script to be installed on a local browser like Chrome.
    – ADTC
    Commented Nov 10, 2012 at 3:50
  • Wait, is there something you can install on Chrome right now that will make the panes appear side-by-side?
    – Jason Swett
    Commented Nov 10, 2012 at 15:52
  • Yes there's an user-script to do it. Here it is: stackapps.com/questions/2245/… .. Wish they made the "side-by-side" option shown in screenshot a standard option all over SE sites.
    – ADTC
    Commented Nov 10, 2012 at 16:23
  • 1
    Never mind it's broken. Makes the editor full screen but not side-by-side. The author promised to fix it but it's been 1.5 years since the promise was made.
    – ADTC
    Commented Nov 10, 2012 at 16:36
  • Now that Discourse (discussion software by ex-SO Jeff Atwood) has this exact same feature, maybe we'll see it in SE! Here's a feature request to implement side-by-side preview the same way Discourse does.
    – Dan Dascalescu
    Commented Apr 9, 2015 at 22:19
  • @ADTC You might be interested in this: stackapps.com/q/6461/26088
    – ᔕᖺᘎᕊ
    Commented Jul 13, 2015 at 11:17
  • This is the same as meta.stackexchange.com/questions/53484 , right? Should it be marked as duplicate? Both questions have many upvotes, favourites, answers, comments and so on.
    – Fabian Röling
    Commented Sep 26, 2017 at 10:35

5 Answers 5

Reset to default
10

Well, here's a simple proof-of-concept userstyle I've whipped up that does this. You'll need at least a 1440px wide screen to use this. Here's how it looks like:

alt text

As you can see, not very good. I'll improve it if anybody's interested.

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url("http://meta.stackexchange.com/questions/ask") {

#content {
  width: 1370px !important;
}

#content #mainbar {
  width: 100% !important;
}

#post-editor {
  overflow: hidden !important;
  width: 100% !important;
}

#sidebar {
  display: none !important;
}

#wmd-preview {
  float: right !important;
  clear: none !important;
}

#wmd-container {
  width: 660px !important;
  float: left !important;
}
}
Improve this answer
5
  • Thanks for doing that. That's a good illustration. As for width, you could always make the editor and preview thinner, like half as thick.
    – Jason Swett
    Commented Nov 22, 2010 at 16:48
  • 4
    @Jason, that was my gut reaction as well, but then the preview wouldn't be a faithful preview of how the question will look when posted. The editor could be slimmed down a bit, but once you pass a certain width it could become a pain to use.
    – Pops
    Commented May 19, 2011 at 17:38
  • Perhaps the preview could be scaled down? It's a preview after all, you don't need to be able to read everything, just see how the post will look, and how much smaller something is compared to something else in the post.
    – Once Upon a Dev
    Commented Jan 1, 2014 at 12:00
  • This looks nice! In the intervening years, since Jeff Atwood moved on to Discourse, they've implemented just that. So here's a feature request to implement side-by-side preview the same way Discourse does.
    – Dan Dascalescu
    Commented Apr 9, 2015 at 22:16
  • @Yi Jiang - I wish this was implemented on StackExchange sites ASAP. Is there some way to use your answer in Chrome/ Chromium browsers? I'd like to do so.
    – Alex S
    Commented Aug 7, 2015 at 12:02
8

I wouldn't like this feature. Usually when posting snippets of code, I like to make sure that there are no scroll bars on my code blocks (I find them annoying). So, I'll truncate/format my code to fit in the alloted width of the question/answer area. I wouldn't be able to do this if the editor and preview were side-by-side, because the preview would be of a shorter width than the actual question area.

Improve this answer
4
  • 1
    Good point. Maybe tabs then. The thing I don't like is you can't always see the question and preview at the same time, and the scrolling is annoying because you have to re-find your place in the question.
    – Jason Swett
    Commented Nov 22, 2010 at 15:48
  • 1
    I like the idea of tabs...
    – Stephen
    Commented Nov 22, 2010 at 15:49
  • 1
    Tabs still disable the real-time nature of the preview. How about a divider between the editor and the preview, so that you could control the length of the preview? I've posted the suggestion as The Discourse layout for side-by-side Markdown preview.
    – Dan Dascalescu
    Commented Apr 9, 2015 at 22:13
  • just make it togglable
    – Aaron Thoma
    Commented Jan 12, 2020 at 6:47
7

An alternate solution I would suggest is making the preview scrollable once it reaches a certain size. This way you can see the same part of the post in both the preview and editor, regardless of the length of your answer.

An extra spiffy feature would be to auto-scroll the preview along with the editor, so as you change where you are in one, the other comes along for the ride.

Improve this answer
3
  • +1 for the first paragraph. But I'll take that back if an auto-scroll gets implemented - I'd hate that :-) (maybe I want to look at a different part of the preview?)
    – Hendrik Vogt
    Commented May 19, 2011 at 20:06
  • 1
    Personally, sorry Hendrik Vogt, I would love a auto-scroll on both boxes!
    – user66001
    Commented Feb 4, 2013 at 3:10
  • Discourse has already implemented autoscroll, could we use that?
    – Dan Dascalescu
    Commented Apr 9, 2015 at 22:14
2

As SO has progressed we've gotten options for viewing edits in multiple views (output, diff, and side by side). It would be nice if had options for writing & updating answers.

Luckily I have large monitors, and I often find myself opening a pair of side by side browsers windows -- one for the question & one for the answer. This makes referencing the question while I'm answering easier. It doesn't, however, solve the mark-down/preview issue. It would be great to be able to put these side by side too.

Improve this answer
1
0

I'm not sure this will be as useful as it seems. The editor is already a fixed height, so all this really does is give you some amount of extra space. When you reach the point in which your post body is too long to fit at the same time as this text box, the extra space you'll earn for the side-by-side isn't that much.

Ultimately, with sufficient length to be yet more, one will run into the same problem and still have to scroll downwards to see everything. The only difference is that now it's going to be off to the side.

Improve this answer
2

You must log in to answer this question.

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