Timeline for Layout: Make the textarea (edit box) for answers and the preview reflect the final width even before posting
Current License: CC BY-SA 4.0
29 events
when toggle format | what | by | license | comment | |
---|---|---|---|---|---|
Nov 23, 2018 at 9:58 | comment | added | anatolyg | Great idea! I have been wondering for years why my code preview is slightly wrong. If this idea gets implemented, it will save much head-scratching for people like me. | |
Nov 22, 2018 at 2:32 | history | edited | Kaiido | CC BY-SA 4.0 |
add live version of the example
|
Nov 21, 2018 at 23:20 | comment | added | mklement0 | @Kaiido: I'm all ears if you have specific objections to the points made it in my question. Otherwise, I'm not interested in further engaging the you-can't-know-how-it-renders-ever-so-why-not-give-up line of reasoning. | |
Nov 21, 2018 at 23:16 | comment | added | Kaiido | @mklement0 I'd argie the only misdirection here has been to make you think that what you see is what the other ones will see... | |
Nov 21, 2018 at 23:10 | comment | added | mklement0 | @Kaiido: As an ideal to approximate it does mean something, and within the constraints laid out in the question, it would. There is no win with the current behavior, only misdirection. | |
Nov 21, 2018 at 23:06 | comment | added | Kaiido | @mklement0 I disagree about it being "broken". Its role is to show how the markup gets transformed as html rendered by the browser. This works. Once again, size consistency means nothing since no two people should have the same browser's window width. Not losing the 60px of the vote panel, nor the time of devs is a win. I think you miss something. In your question, you speak about the true width, but because of responsive design that got included lately, there is no such true width anymore. | |
Nov 21, 2018 at 17:36 | history | edited | mklement0 | CC BY-SA 4.0 |
added 171 characters in body
|
Nov 21, 2018 at 17:34 | comment | added | mklement0 | @Kaiido: The purpose of a preview is to show you how things will render, which is currently broken. The fact that rendering may be different in different situation doesn't mean that a best - and simple - effort should be made to show you how things will render. As my update shows, there is rendering consistency to be had, albeit not universally. | |
Nov 21, 2018 at 17:22 | comment | added | mklement0 | @jpmc26: Yes, but please see my update about rendering differences and the consistence that can be had, within limits. | |
Nov 21, 2018 at 17:22 | comment | added | mklement0 | @Makyen: Good points, so the answer is: it's not a perfect, universal solution, but there's enough consistency to make the fix worthwhile - I've updated the answer with screen shots of rendering differences across platforms and browsers. | |
Nov 21, 2018 at 17:18 | history | edited | mklement0 | CC BY-SA 4.0 |
added 2252 characters in body
|
Nov 21, 2018 at 16:27 | comment | added | jpmc26 | It's worth noting that the width is screen and window dependent anyway, meaning the width you see isn't necessarily what everyone else sees. | |
Nov 21, 2018 at 12:03 | comment | added | Kaiido | @Makyen you may want to post it as an answer taking the counter-part of this FR? I for one whose screen size always change, almost never see twice a post with the same layout. So the fact that it was rendered the same when I posted it as what I had in the editor is one of the last things I'd like SE devs to spend on, since anyway when I'll get back to it, it won't be the same anymore. | |
Nov 21, 2018 at 7:13 | comment | added | Makyen Mod | So, in other words, even if you are writing your code such that it doesn't wrap for you, that does not mean that it won't wrap for someone else using a different browser/OS, or the same browser, but with just a window size smaller than the default. The differences, even using the default maximum sizes, are a couple/few characters horizontally and a couple/few lines vertically. Note: I mean H and/or V scrolling after posting, as there are differences between what is previewed, both horizontally and vertically both before and after initial posting and before and after reloading the page. | |
Nov 21, 2018 at 7:08 | comment | added | Makyen Mod | This, of course, also doesn't take into account that SE's post display area is semi-responsive, so the user may have their display/window set such that the width of the post's code block is significantly smaller than the maximum which SE permits. | |
Nov 21, 2018 at 7:07 | comment | added | Makyen Mod | While this is possible, you have to take into account that the number of characters wide for code blocks is different in each browser. Assuming that's not resolved by SE, then the only solution is to have the width of the edit textarea be that which results in the text wrapping with the minimum number of characters in any browser. Note: the width you need set is different in each browser to obtain this same number of minimum characters. Also note that it's not a matter of the edit text area just having the same width in characters, as you must account for the 4 spaces in front of code lines. | |
Nov 20, 2018 at 19:31 | history | edited | mklement0 | CC BY-SA 4.0 |
added 4 characters in body
|
Nov 20, 2018 at 19:28 | comment | added | mklement0 | @HereticMonkey: Yes, what ultimately matters is the preview, and I've made that clearer in the question. I guess the textarea could remain wider, but having it differ in width from the associated preview might be confusing. | |
Nov 20, 2018 at 19:26 | history | edited | mklement0 | CC BY-SA 4.0 |
added 4 characters in body
|
Nov 20, 2018 at 19:23 | comment | added | Heretic Monkey | Note that the final width of the text will likely not match the width of the textarea because of font differences, markdown, etc. The preview would be better served if it was the same width as the final output though, so I agree with that. | |
Nov 20, 2018 at 16:56 | history | edited | mklement0 | CC BY-SA 4.0 |
added 125 characters in body
|
Nov 20, 2018 at 16:54 | comment | added | mklement0 | @TinyGiant: Not with respect to the actual width once posted. That is, the preview may suggest that there'll be no horizontal scrolling, yet on posting there may be - that's the concern; in practice it is a frequent problem with shell command lines; I've added that note to the answer. | |
Nov 20, 2018 at 16:52 | comment | added | user4639281 | Your code should render the same regardless if it is properly formatted as code. | |
Nov 20, 2018 at 16:37 | history | edited | mklement0 | CC BY-SA 4.0 |
added 7 characters in body
|
Nov 20, 2018 at 16:30 | comment | added | Picachieu | Now I see what you mean | |
Nov 20, 2018 at 16:30 | history | edited | mklement0 | CC BY-SA 4.0 |
added 152 characters in body
|
Nov 20, 2018 at 16:28 | comment | added | mklement0 | @publicstaticvoidmain: No, it isn't, because the preview also shows the extra width - in other words: it is not a preview of what will actually render. I've updated the answer to make that clearer. | |
Nov 20, 2018 at 16:27 | comment | added | Picachieu | That's what the code preview is for. | |
Nov 20, 2018 at 16:23 | history | asked | mklement0 | CC BY-SA 4.0 |