1911243 - tsu-results.rf.gd - The design of table content titles is not aligned

Status: NEW

(Web Compatibility :: Site Reports, defect, P3)

Description

[Raul Bucata]

Environment:
Operating system: Windows 11
Firefox version: Firefox 128.0.3

Steps to reproduce:

1. Navigate to: http://tsu-results.rf.gd/tsu_results/f3_championship/season_3/F3%20Championship%20-%20season%203.html
2. Observe the titles of the table content

Expected Behavior:
Items are tilted towards the right

Actual Behavior:
Items are misaligned

Notes:

• Reproduces regardless of the status of ETP
• Reproduces in Firefox Nightly, and Firefox Release
• Does not reproduce in Chrome

Created from https://github.com/webcompat/web-bugs/issues/139668

Comment 1

[Jeff Muizelaar [:jrmuizel]]

The following comes from styles.css:

@-moz-document url-prefix() 
{
        		.sortable th 
        		{
        		font-size: max(16px, 0.95vw);
        		writing-mode: vertical-rl;
        		text-align: start;
        		padding: 10px;
        		transform: rotate(-180deg);
        		vertical-align: bottom;
        		vertical-align: -moz-middle-with-baseline;
        		}        		
        		.sortable td 
        		{
        		text-align: right;
        		}
}

which is overriding

      		.sortable th
        		{
        		height: 220px;
        		font-size: max(16px, 0.95vw);
        		writing-mode: vertical-rl;
        		text-align: start;
        		padding: 10px;
        		transform: skew(-45deg) rotate(-180deg) matrix(1.3, 0.6, 0.2, 1, -69, 10);
        		white-space: pre-line;
        		}