diff --git a/static/styles/overlay.css b/static/styles/overlay.css
index 6825aa7781..aedbb9a167 100644
--- a/static/styles/overlay.css
+++ b/static/styles/overlay.css
@@ -125,16 +125,23 @@
 
 #overlay .image-description {
     /* approx width of screen minus action buttons on the side. */
-    width: calc(100% - 320px);
+    width: calc(100% - 260px);
+    /* add some extra margin top and remove some bottom to keep the
+       height the same. and vertically center the text with the buttons. */
+    margin-top: 25px;
+    margin-bottom: 15px;
 
     font-size: 1.3rem;
     color: #fff;
 }
 
 #overlay .image-description .title {
+    display: inline-block;
+    vertical-align: top;
+
     font-weight: 500;
     line-height: normal;
-    max-width: calc(100%);
+    max-width: calc(100% - 210px);
 
     /* Required for text-overflow */
     white-space: nowrap;
@@ -142,6 +149,11 @@
     text-overflow: ellipsis;
 }
 
+#overlay .image-description .user::before {
+    margin-right: 5px;
+    content: "–";
+}
+
 #overlay .player-container {
     height: calc(100vh - 71px);
     display: flex;
@@ -157,7 +169,14 @@
 }
 
 #overlay .image-description .user {
+    max-width: 200px;
+    display: inline-block;
+    vertical-align: top;
     font-weight: 300;
+    line-height: normal;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: pre;
 }
 
 .image-actions .button {
@@ -198,4 +217,8 @@
         overflow: hidden;
         text-overflow: ellipsis;
     }
+
+    #overlay .image-description .title {
+        max-width: calc(100% - 60px);
+    }
 }
diff --git a/templates/zerver/image-overlay.html b/templates/zerver/image-overlay.html
index 4221df1c20..58a067f79a 100644
--- a/templates/zerver/image-overlay.html
+++ b/templates/zerver/image-overlay.html
@@ -2,8 +2,7 @@
   <div class="image-info-wrapper">
     <div class="image-description">
       <div class="title"></div>
-      &mdash;
-      <span class="user"></span>
+      <div class="user"></div>
     </div>
     <div class="exit">x</div>
     <div class="image-actions">