diff --git a/res/css/views/elements/_ImageView.scss b/res/css/views/elements/_ImageView.scss
index e6ed3684bb..c87cfd1ece 100644
--- a/res/css/views/elements/_ImageView.scss
+++ b/res/css/views/elements/_ImageView.scss
@@ -36,13 +36,14 @@ limitations under the License.
     overflow: auto;
     margin: 0 50px 50px 50px;
     display: flex;
+    height: 100%;
 }
 
 .mx_ImageView_content img {
-    flex: 1;
     object-fit: contain;
     pointer-events: all;
-    margin: auto;
+    //margin: auto;
+    //margin: 0 auto 0 auto;
 }
 
 .mx_ImageView_panel {
diff --git a/src/components/views/elements/ImageView.js b/src/components/views/elements/ImageView.js
index 6dfd1f78ad..a42d957daa 100644
--- a/src/components/views/elements/ImageView.js
+++ b/src/components/views/elements/ImageView.js
@@ -160,14 +160,8 @@ export default class ImageView extends React.Component {
             height: displayHeight
         };
 */
-        let style = {};
         let res;
 
-        style = {
-            width: this.state.zoom + "%",
-            height: this.state.zoom + "%",
-        };
-
         if (this.props.width && this.props.height) {
             res = this.props.width + "x" + this.props.height + "px";
         }
@@ -217,7 +211,8 @@ export default class ImageView extends React.Component {
         }
 
         const rotationDegrees = this.state.rotationDegrees;
-        const effectiveStyle = {transform: `rotate(${rotationDegrees}deg)`, ...style};
+        const zoom = this.state.zoom/100;
+        const effectiveStyle = {transform: `rotate(${rotationDegrees}deg) scale(${zoom})`};
 
         return (
             <FocusLock