diff --git a/res/css/views/elements/_MessageEditor.scss b/res/css/views/elements/_MessageEditor.scss
index db2c53b3ed..15f60f5922 100644
--- a/res/css/views/elements/_MessageEditor.scss
+++ b/res/css/views/elements/_MessageEditor.scss
@@ -20,7 +20,8 @@ limitations under the License.
     // this is to try not make the text move but still have some
     // padding around and in the editor.
     // Actual values from fiddling around in inspector
-    margin: -7px 24px -5px -10px;   // right margin: -10px + 34px
+    margin: -7px -10px -5px -10px;
+    overflow: visible !important;   // override mx_EventTile_content
 
     .mx_MessageEditor_editor {
         border-radius: 4px;
@@ -90,7 +91,7 @@ limitations under the License.
         z-index: 100;
         right: 0;
         margin: 0 -110px 0 0;
-        padding-right: 138px;
+        padding-right: 147px;
 
         .mx_AccessibleButton {
             margin-left: 5px;
diff --git a/src/components/views/elements/MessageEditor.js b/src/components/views/elements/MessageEditor.js
index 4f1e1675a5..1f3440d740 100644
--- a/src/components/views/elements/MessageEditor.js
+++ b/src/components/views/elements/MessageEditor.js
@@ -27,6 +27,7 @@ import Autocomplete from '../rooms/Autocomplete';
 import {PartCreator} from '../../../editor/parts';
 import {renderModel} from '../../../editor/render';
 import {MatrixEvent, MatrixClient} from 'matrix-js-sdk';
+import classNames from 'classnames';
 
 export default class MessageEditor extends React.Component {
     static propTypes = {
@@ -177,7 +178,7 @@ export default class MessageEditor extends React.Component {
             </div>;
         }
         const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
-        return <div className="mx_MessageEditor">
+        return <div className={classNames("mx_MessageEditor", this.props.className)}>
                 { autoComplete }
                 <div
                     className="mx_MessageEditor_editor"
diff --git a/src/components/views/messages/TextualBody.js b/src/components/views/messages/TextualBody.js
index 380d04d1db..e03d82c9a4 100644
--- a/src/components/views/messages/TextualBody.js
+++ b/src/components/views/messages/TextualBody.js
@@ -471,7 +471,7 @@ module.exports = React.createClass({
     render: function() {
         if (this.props.isEditing) {
             const MessageEditor = sdk.getComponent('elements.MessageEditor');
-            return <MessageEditor event={this.props.mxEvent} />;
+            return <MessageEditor event={this.props.mxEvent} className="mx_EventTile_content" />;
         }
         const EmojiText = sdk.getComponent('elements.EmojiText');
         const mxEvent = this.props.mxEvent;