diff --git a/res/css/views/rooms/_MessageComposer.scss b/res/css/views/rooms/_MessageComposer.scss
index 14562fe7ed..a0c8048475 100644
--- a/res/css/views/rooms/_MessageComposer.scss
+++ b/res/css/views/rooms/_MessageComposer.scss
@@ -23,10 +23,6 @@ limitations under the License.
     padding-left: 84px;
 }
 
-.mx_MessageComposer_wrapper.mx_MessageComposer_hasE2EIcon {
-    padding-left: 109px;
-}
-
 .mx_MessageComposer_replaced_wrapper {
     margin-left: auto;
     margin-right: auto;
@@ -78,6 +74,10 @@ limitations under the License.
 .mx_MessageComposer_e2eIcon.mx_E2EIcon {
     position: absolute;
     left: 60px;
+    width: 16px;
+    height: 16px;
+    margin-right: 0; // Counteract the E2EIcon class
+    margin-left: 3px; // Counteract the E2EIcon class
 
     &::after {
         background-color: $composer-e2e-icon-color;
diff --git a/src/components/views/rooms/MessageComposer.js b/src/components/views/rooms/MessageComposer.js
index 632ca53f82..b41b970fc6 100644
--- a/src/components/views/rooms/MessageComposer.js
+++ b/src/components/views/rooms/MessageComposer.js
@@ -353,13 +353,9 @@ export default class MessageComposer extends React.Component {
             );
         }
 
-        const wrapperClasses = classNames({
-            mx_MessageComposer_wrapper: true,
-            mx_MessageComposer_hasE2EIcon: !!this.props.e2eStatus,
-        });
         return (
             <div className="mx_MessageComposer">
-                <div className={wrapperClasses}>
+                <div className="mx_MessageComposer_wrapper">
                     <div className="mx_MessageComposer_row">
                         { controls }
                     </div>
diff --git a/src/components/views/rooms/SlateMessageComposer.js b/src/components/views/rooms/SlateMessageComposer.js
index 4bb2f29e61..eb41f6729b 100644
--- a/src/components/views/rooms/SlateMessageComposer.js
+++ b/src/components/views/rooms/SlateMessageComposer.js
@@ -460,13 +460,9 @@ export default class SlateMessageComposer extends React.Component {
 
         const showFormatBar = this.state.showFormatting && this.state.inputState.isRichTextEnabled;
 
-        const wrapperClasses = classNames({
-            mx_MessageComposer_wrapper: true,
-            mx_MessageComposer_hasE2EIcon: !!this.props.e2eStatus,
-        });
         return (
             <div className="mx_MessageComposer">
-                <div className={wrapperClasses}>
+                <div className="mx_MessageComposer_wrapper">
                     <div className="mx_MessageComposer_row">
                         { controls }
                     </div>