diff --git a/res/css/views/messages/_MImageBody.scss b/res/css/views/messages/_MImageBody.scss
index f5d8131e6e3..a748435cd8a 100644
--- a/res/css/views/messages/_MImageBody.scss
+++ b/res/css/views/messages/_MImageBody.scss
@@ -16,10 +16,6 @@ limitations under the License.
 
 $timelineImageBorderRadius: 4px;
 
-.mx_MImageBody {
-    display: block;
-}
-
 .mx_MImageBody_thumbnail {
     object-fit: contain;
     border-radius: $timelineImageBorderRadius;
@@ -28,7 +24,7 @@ $timelineImageBorderRadius: 4px;
     justify-content: center;
     align-items: center;
 
-    > canvas {
+    > div > canvas {
         border-radius: $timelineImageBorderRadius;
     }
 }
diff --git a/src/components/views/messages/MImageBody.tsx b/src/components/views/messages/MImageBody.tsx
index c24f014d841..945994d9640 100644
--- a/src/components/views/messages/MImageBody.tsx
+++ b/src/components/views/messages/MImageBody.tsx
@@ -416,10 +416,10 @@ export default class MImageBody extends React.Component<IBodyProps, IState> {
 
         if (this.state.error !== null) {
             return (
-                <span className="mx_MImageBody">
+                <div className="mx_MImageBody">
                     <img src={require("../../../../res/img/warning.svg")} width="16" height="16" />
                     { _t("Error decrypting image") }
-                </span>
+                </div>
             );
         }
 
@@ -434,10 +434,10 @@ export default class MImageBody extends React.Component<IBodyProps, IState> {
         const thumbnail = this.messageContent(contentUrl, thumbUrl, content);
         const fileBody = this.getFileBody();
 
-        return <span className="mx_MImageBody">
+        return <div className="mx_MImageBody">
             { thumbnail }
             { fileBody }
-        </span>;
+        </div>;
     }
 }