diff --git a/web/src/ui/timeline/TimelineEvent.css b/web/src/ui/timeline/TimelineEvent.css
index 821f229..b0f8205 100644
--- a/web/src/ui/timeline/TimelineEvent.css
+++ b/web/src/ui/timeline/TimelineEvent.css
@@ -125,7 +125,7 @@ div.timeline-event {
 		}
 	}
 
-	&.hidden-event {
+	&.small-event {
 		grid-template:
 			"cmc       cmc    cmc     cmc"    0
 			"timestamp avatar content status" auto
@@ -144,7 +144,7 @@ div.timeline-event {
 			display: flex;
 		}
 
-		+ div.timeline-event.hidden-event {
+		+ div.timeline-event.small-event {
 			margin-top: 0;
 		}
 	}
@@ -193,7 +193,7 @@ div.event-content > div.event-reactions {
 	}
 }
 
-div.hidden-event > div.sender-avatar, blockquote.reply-body > div.reply-sender > div.sender-avatar {
+div.small-event > div.sender-avatar, blockquote.reply-body > div.reply-sender > div.sender-avatar {
 	margin-top: 0;
 	display: flex;
 	align-items: center;
diff --git a/web/src/ui/timeline/TimelineEvent.tsx b/web/src/ui/timeline/TimelineEvent.tsx
index b4cbffb..cbff6c1 100644
--- a/web/src/ui/timeline/TimelineEvent.tsx
+++ b/web/src/ui/timeline/TimelineEvent.tsx
@@ -91,6 +91,9 @@ const TimelineEvent = ({ evt, prevEvt, disableMenu }: TimelineEventProps) => {
 	if (evt.type === "m.room.member") {
 		wrapperClassNames.push("membership-event")
 	}
+	if (BodyType === HiddenEvent) {
+		wrapperClassNames.push("hidden-event")
+	}
 	let dateSeparator = null
 	const prevEvtDate = prevEvt ? new Date(prevEvt.timestamp) : null
 	if (prevEvtDate && (
@@ -107,7 +110,7 @@ const TimelineEvent = ({ evt, prevEvt, disableMenu }: TimelineEventProps) => {
 	let renderAvatar = true
 	let eventTimeOnly = false
 	if (isSmallEvent(BodyType)) {
-		wrapperClassNames.push("hidden-event")
+		wrapperClassNames.push("small-event")
 		smallAvatar = true
 		eventTimeOnly = true
 	} else if (prevEvt?.sender === evt.sender &&