diff --git a/web/src/info_overlay.ts b/web/src/info_overlay.ts
index 15027807ad..f6c91da8ad 100644
--- a/web/src/info_overlay.ts
+++ b/web/src/info_overlay.ts
@@ -160,7 +160,7 @@ def zulip():
     {
         markdown: "<time:2023-05-28T13:30:00+05:30>",
         output_html:
-            '<p><time datetime="2023-05-28T08:00:00Z"><i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>Sun, May 28, 2023, 1:30 PM</time></p>',
+            '<p><time datetime="2023-05-28T08:00:00Z"><span class="timestamp-content-wrapper"><i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>Sun, May 28, 2023, 1:30 PM</time></span></p>',
     },
     {
         markdown: `/poll What did you drink this morning?
diff --git a/web/styles/rendered_markdown.css b/web/styles/rendered_markdown.css
index 6cd06581b8..a79a0d0b4a 100644
--- a/web/styles/rendered_markdown.css
+++ b/web/styles/rendered_markdown.css
@@ -236,15 +236,25 @@
 
     /* Timestamps */
     & time {
-        display: inline-flex;
-        align-items: baseline;
-        gap: 3px;
         background: hsl(0deg 0% 93%);
         border-radius: 3px;
-        padding: 0 0.2em;
         box-shadow: 0 0 0 1px hsl(0deg 0% 80%);
         white-space: nowrap;
-        margin: 0 2px 1px;
+        margin: 0 2px;
+        /* Reduce the font-size to reduce the
+           footprint of the timestamp block. */
+        font-size: 0.95em;
+
+        .timestamp-content-wrapper {
+            /* Restore the font-size to match the rest
+               of the message area, and apply the layout
+               for the icon. */
+            font-size: 1.0526em;
+            padding: 0 0.2em;
+            display: inline-flex;
+            align-items: baseline;
+            gap: 3px;
+        }
 
         .markdown-timestamp-icon {
             align-self: center;
diff --git a/web/templates/markdown_timestamp.hbs b/web/templates/markdown_timestamp.hbs
index 85aa33c189..7899c3c272 100644
--- a/web/templates/markdown_timestamp.hbs
+++ b/web/templates/markdown_timestamp.hbs
@@ -1,2 +1,6 @@
-<i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>
-{{ text ~}}
+{{~!-- --~}}
+<span class="timestamp-content-wrapper">
+    <i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>
+    {{~ text ~}}
+</span>
+{{~!-- --~}}
diff --git a/web/tests/rendered_markdown.test.js b/web/tests/rendered_markdown.test.js
index 6074dfee9e..a07ee4770d 100644
--- a/web/tests/rendered_markdown.test.js
+++ b/web/tests/rendered_markdown.test.js
@@ -426,7 +426,7 @@ run_test("timestamp", ({mock_template}) => {
     // Final asserts
     assert.equal(
         $timestamp.html(),
-        '<i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>\nThu, Jan 1, 1970, 12:00 AM',
+        '<span class="timestamp-content-wrapper">\n    <i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>Thu, Jan 1, 1970, 12:00 AM</span>',
     );
     assert.equal($timestamp_invalid.text(), "never-been-set");
 });
@@ -448,14 +448,14 @@ run_test("timestamp-twenty-four-hour-time", ({mock_template, override}) => {
     rm.update_elements($content);
     assert.equal(
         $timestamp.html(),
-        '<i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>\nWed, Jul 15, 2020, 20:40',
+        '<span class="timestamp-content-wrapper">\n    <i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>Wed, Jul 15, 2020, 20:40</span>',
     );
 
     override(user_settings, "twenty_four_hour_time", false);
     rm.update_elements($content);
     assert.equal(
         $timestamp.html(),
-        '<i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>\nWed, Jul 15, 2020, 8:40 PM',
+        '<span class="timestamp-content-wrapper">\n    <i class="zulip-icon zulip-icon-clock markdown-timestamp-icon"></i>Wed, Jul 15, 2020, 8:40 PM</span>',
     );
 });