diff --git a/resources/skins.citizen.scripts/resizeObserver.js b/resources/skins.citizen.scripts/resizeObserver.js
index 07eff9bc..2f5069e1 100644
--- a/resources/skins.citizen.scripts/resizeObserver.js
+++ b/resources/skins.citizen.scripts/resizeObserver.js
@@ -10,18 +10,18 @@ function initResizeObserver( onResize, onResizeStart, onResizeEnd ) {
 	let resizeStarted = false;
 
 	/* eslint-disable-next-line compat/compat */
-	return new ResizeObserver( () => {
+	return new ResizeObserver( ( entries ) => {
 		if ( onResizeStart && !resizeStarted ) {
-			onResizeStart();
+			onResizeStart( entries[ 0 ] );
 			resizeStarted = true;
 		}
 
-		onResize();
+		onResize( entries[ 0 ] );
 
 		if ( onResizeEnd ) {
 			clearTimeout( window.resizedFinished );
 			window.resizedFinished = setTimeout( () => {
-				onResizeEnd();
+				onResizeEnd( entries[ 0 ] );
 				resizeStarted = false;
 			}, 250 );
 		}
diff --git a/resources/skins.citizen.scripts/setupObservers.js b/resources/skins.citizen.scripts/setupObservers.js
index dfc125aa..9c6f9638 100644
--- a/resources/skins.citizen.scripts/setupObservers.js
+++ b/resources/skins.citizen.scripts/setupObservers.js
@@ -251,23 +251,33 @@ const main = () => {
 
 	pageHeaderObserver.observe( stickyIntersection );
 
+	// Initialize var
+	let bodyWidth = 0;
 	const bodyObserver = resizeObserver.initResizeObserver(
 		// onResize
 		() => {},
 		// onResizeStart
-		() => {
+		( entry ) => {
+			// eslint-disable-next-line es-x/no-optional-chaining
+			bodyWidth = entry.borderBoxSize?.[ 0 ].inlineSize;
 			// Disable all CSS animation during resize
 			if ( document.documentElement.classList.contains( 'citizen-animations-ready' ) ) {
 				document.documentElement.classList.remove( 'citizen-animations-ready' );
 			}
-			pauseStickyHeader();
 		},
 		// onResizeEnd
-		() => {
+		( entry ) => {
+			// eslint-disable-next-line es-x/no-optional-chaining
+			const newBodyWidth = entry.borderBoxSize?.[ 0 ].inlineSize;
+			const shouldRecalcStickyHeader =
+				document.body.classList.contains( PAGE_TITLE_INTERSECTION_CLASS ) &&
+				typeof newBodyWidth === 'number' &&
+				bodyWidth !== newBodyWidth;
+
 			// Enable CSS animation after resize is finished
 			document.documentElement.classList.add( 'citizen-animations-ready' );
 			// Recalculate sticky header height at the end of the resize
-			if ( document.body.classList.contains( PAGE_TITLE_INTERSECTION_CLASS ) ) {
+			if ( shouldRecalcStickyHeader ) {
 				resumeStickyHeader();
 			}
 		}