When a Wiki Post is edited then have problems maintaining the correct width on mobile devices

[dax (Daniela)]

Tested using an Huawei P10 Lite and Chrome

Examples of affected topics:

• How to use Discourse core variables in your theme
  produces:

• https://meta.discourse.org/t/the-discourse-wikipedia-page-is-very-poor/72026/10?u=dax (code)
• https://meta.discourse.org/t/draft-recommended-hosting-providers-for-novices/79399 (table + quote)
• Discourse vs. Lithium (oneboxes + quote)

I tried to edit a wiki topic that had never been modified and that was displayed correctly by clicking the green pencil, immediately after the fake change made (I changed a letter) the layout on mobile broke: What is a onebox?

This topic has the correct layout instead, even if it has just been modified Contributor Interviews – Jay Pfaffman

I am able to break the layout by entering at least:

• some code ([code][/code] or 4 spaces)
• a onebox
• quotes
• a table

PS. sorry Jay!

[sam (Sam Saffron)]

This has got to be some missing CSS rule limiting width of the modal cc @awesomerobot

[awesomerobot (Kris)]

Pushed some fixes:

https://github.com/discourse/discourse/commit/900f37e5a9fe714c939b7bbd5cd27ef3942244b0

• The modal container/controls shouldn’t overflow anymore on mobile devices, but in some instances the content will (wide tables and code blocks with long unbroken strings). I could force tables and code blocks to break words and wrap, but it feels better to preserve the structure and scroll horizontally.

• I also updated it so the history modal will resize to portrait tablet resolutions, previously we were at a fixed 960px width.