diff --git a/res/css/structures/_FilePanel.scss b/res/css/structures/_FilePanel.scss
index e2129e24ddc..d863702d5c5 100644
--- a/res/css/structures/_FilePanel.scss
+++ b/res/css/structures/_FilePanel.scss
@@ -103,7 +103,6 @@ limitations under the License.
     position: initial;
     font-size: $font-14px;
     opacity: 1.0;
-    color: $event-timestamp-color;
 }
 
 /* Overrides for the wrappers around the body tile */
diff --git a/res/css/views/messages/_MessageTimestamp.scss b/res/css/views/messages/_MessageTimestamp.scss
index d496ff82c8c..ea11cc5a34b 100644
--- a/res/css/views/messages/_MessageTimestamp.scss
+++ b/res/css/views/messages/_MessageTimestamp.scss
@@ -15,8 +15,13 @@ limitations under the License.
 */
 
 .mx_MessageTimestamp {
+    --MessageTimestamp-max-width: 80px;
+
     color: $event-timestamp-color;
     font-size: $font-10px;
     font-variant-numeric: tabular-nums;
+    display: block; // enable the width setting below
     width: $MessageTimestamp_width;
+    white-space: nowrap;
+    user-select: none;
 }
diff --git a/res/css/views/right_panel/_ThreadPanel.scss b/res/css/views/right_panel/_ThreadPanel.scss
index 50c61fa7ead..ca0b4409cae 100644
--- a/res/css/views/right_panel/_ThreadPanel.scss
+++ b/res/css/views/right_panel/_ThreadPanel.scss
@@ -121,7 +121,6 @@ limitations under the License.
     }
 
     .mx_MessageTimestamp {
-        font-size: $font-12px;
         color: $secondary-content;
     }
 
diff --git a/res/css/views/rooms/_EventBubbleTile.scss b/res/css/views/rooms/_EventBubbleTile.scss
index def5816ed03..1717c611e2a 100644
--- a/res/css/views/rooms/_EventBubbleTile.scss
+++ b/res/css/views/rooms/_EventBubbleTile.scss
@@ -64,6 +64,11 @@ limitations under the License.
     margin-left: var(--EventTile_bubble-margin-inline-start);
     font-size: $font-14px;
 
+    .mx_MessageTimestamp {
+        width: unset; // Cancel the default width
+        max-width: var(--MessageTimestamp-max-width);
+    }
+
     .mx_ThreadSummary {
         clear: both;
         width: fit-content;
diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss
index ab524ad2df9..7ae672694c5 100644
--- a/res/css/views/rooms/_EventTile.scss
+++ b/res/css/views/rooms/_EventTile.scss
@@ -219,11 +219,8 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
     }
 
     .mx_MessageTimestamp {
-        display: block;
-        white-space: nowrap;
         left: 0px;
         text-align: center;
-        user-select: none;
     }
 
     &.mx_EventTile_continuation .mx_EventTile_line {
@@ -861,8 +858,8 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
     }
 
     .mx_MessageTimestamp {
-        max-width: 80px;
-        width: auto;
+        font-size: $font-12px;
+        max-width: var(--MessageTimestamp-max-width);
         position: initial;
     }
 }
@@ -894,10 +891,6 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
             padding-inline-end: 0;
         }
 
-        .mx_MessageTimestamp {
-            font-size: $font-10px;
-        }
-
         // handling for hidden events (e.g reactions) in the thread view
         &.mx_EventTile_info {
             padding-top: 0;
@@ -1042,6 +1035,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
 
             .mx_MessageTimestamp {
                 top: 2px; // Align with mx_EventTile_content
+                position: absolute; // for IRC layout
             }
 
             .mx_EventTile_senderDetails {
diff --git a/res/css/views/rooms/_IRCLayout.scss b/res/css/views/rooms/_IRCLayout.scss
index 1e43132ba54..bff0175d35d 100644
--- a/res/css/views/rooms/_IRCLayout.scss
+++ b/res/css/views/rooms/_IRCLayout.scss
@@ -116,7 +116,6 @@ $irc-line-height: $font-18px;
         }
 
         .mx_MessageTimestamp {
-            font-size: $font-10px;
             text-align: right;
         }
 
diff --git a/res/css/views/rooms/_PinnedEventTile.scss b/res/css/views/rooms/_PinnedEventTile.scss
index 82de811b285..47781a3b32f 100644
--- a/res/css/views/rooms/_PinnedEventTile.scss
+++ b/res/css/views/rooms/_PinnedEventTile.scss
@@ -89,13 +89,13 @@ limitations under the License.
 
     .mx_PinnedEventTile_footer {
         grid-area: footer;
-        font-size: 10px;
+        font-size: $font-10px;
         line-height: 12px;
 
         .mx_PinnedEventTile_timestamp {
-            font-size: inherit;
-            line-height: inherit;
             color: $secondary-content;
+            display: unset;
+            width: unset; // Cancel the default width value
         }
 
         .mx_AccessibleButton_kind_link {
diff --git a/src/components/views/rooms/PinnedEventTile.tsx b/src/components/views/rooms/PinnedEventTile.tsx
index 8f6247b5f6d..f9e4d858050 100644
--- a/src/components/views/rooms/PinnedEventTile.tsx
+++ b/src/components/views/rooms/PinnedEventTile.tsx
@@ -144,7 +144,7 @@ export default class PinnedEventTile extends React.Component<IProps> {
             </div>
 
             <div className="mx_PinnedEventTile_footer">
-                <span className="mx_PinnedEventTile_timestamp">
+                <span className="mx_MessageTimestamp mx_PinnedEventTile_timestamp">
                     { formatDate(new Date(this.props.event.getTs())) }
                 </span>