Summary:

Sticky topic rows (#postrow-inline-XXXXX > td.alt-topicsubject.alvt.sticky_css) start at 0px height and then expand to 80px, causing a layout shift on forum index pages.

Environment:

URL: https://www.stovebolt.com/ubbthreads/ubbthreads.php/forums/1/1/engine-shop
Affected element: #postrow-inline-1585242 > td.alt-topicsubject.alvt.sticky_css
CLS impact: P50–P99 = 0.105

Observed behavior:

Initial render: { width: 0, height: 0 }
Post-load: { width: 0, height: 80 }
The sticky topic table cell appears to have no reserved height when first painted. Once the sticky styling/content is applied, the row grows by 80px and shifts everything below it.

Expected behavior:

Sticky topic rows should have their final height reserved at initial paint.

Suggested fix:

Add min-height: 80px (or the computed final height) to .sticky_css or td.alt-topicsubject.alvt in the stylesheet, or ensure the sticky row HTML is fully formed server-side before the browser calculates layout.


The Stovebolt Geek
https://www.stovebolt.com/ubbthreads/ubbthreads.php

Server Information
UBB.threads Version 8.0.0
Release 20240826
Server OS Linux
Server Load 0.11
Web Server Apache/2.4.37
PHP Version 8.3.11
MYSQL Version 8.0.39
Database Size 1.82 GB