fix flexbox settings

src/client/js/components/PageEditor.jsx

@@ -288,7 +288,7 @@ class PageEditor extends React.Component {
     const emojiStrategy = this.props.appContainer.getEmojiStrategy();
 
     return (
-      <div className="d-flex">
+      <div className="d-flex flex-wrap">
         <div className="page-editor-editor-container" style={{ flex: 1 }}>
           <Editor
             ref={(c) => { this.editor = c }}

src/client/styles/scss/_on-edit.scss

@@ -132,6 +132,14 @@ body.on-edit {
     }
   }
 
+  // deal with word wrap problem
+  // see: https://qiita.com/mpyw/items/dfc63c1fed5dfc5eda26
+  .page-editor-editor-container,
+  .page-editor-preview-container {
+    min-width: 0;
+    overflow-wrap: break-word;
+  }
+
   /*********************
    * Navigation styles
    */