Summary:
Forum tables in UBB.threads cause Cumulative Layout Shift (CLS) because tbopen.tpl uses table-layout: auto (the default). As forum data, images, and text load, column widths recalculate continuously, pushing page content around and degrading Core Web Vitals scores.
Affected File:templates/default/tbopen.tpl (and any style overrides of this template)
Problem Description:The table wrapper .t_outer and content table .t_inner rely on the browser’s default table-layout: auto. In this mode, the browser must calculate optimal column widths by scanning all rows. As content streams in—especially forum icons, topic titles, and “last post” metadata—columns resize, causing visible layout shifts. This is flagged in real-user monitoring (RUM) as CLS, with scores ranging from 0.12 to 0.24 on forum list pages.
Additionally, because .t_inner is nested inside .t_outer, shifts in the inner table propagate to the outer wrapper, compounding the issue.
Root Cause:tbopen.tpl does not declare table-layout: fixed on either table. Without it:
Column widths are determined after all content loads.
Images and dynamic text cause late reflows.
The browser cannot reserve stable space for table cells during initial paint.
Proposed Fix:Add table-layout: fixed to both .t_outer and .t_inner in tbopen.tpl. The first row of the inner table (defined in templates like forum.tpl) already contains explicit width attributes on header cells, so the browser can lock column sizes immediately after parsing the header row.
Current code (tbopen.tpl):<table class="t_outer" style="width:100%;padding:0;border-spacing:0;">
<tr>
<td>
<table class="t_inner" style="width:100%;padding:0;border-spacing:1px;">
Recommended code:<table class="t_outer" style="width:100%;padding:0;border-spacing:0;table-layout:fixed;">
<tr>
<td>
<table class="t_inner" style="width:100%;padding:0;border-spacing:1px;table-layout:fixed;">
Impact:Eliminates table-related CLS on forum list, active topics, and category pages.
Improves Core Web Vitals (specifically CLS) without requiring changes to individual forum/category templates.
No visual regression: existing width attributes in header rows continue to define column proportions.
Additional Recommendation:Consider adding explicit <colgroup> definitions to forum.tpl (and similar listing templates) as a future enhancement. While not required to fix the shift, <col> elements provide even more deterministic column sizing across all browsers and make the grid behavior explicit rather than inferred from the first header row.
Environment:UBB.threads 7.7.x / 8.0.x
Observed on: /ubbthreads.php, /ubbthreads.php/forum_summary, /ubbthreads.php/activetopics/*, /ubbthreads.php/forums/*
