Bug 253508 - CSS writing-mode does not reset correctly when overridden in media queries
Summary: CSS writing-mode does not reset correctly when overridden in media queries
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: Safari 16
Hardware: Mac (Intel) macOS 13
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2023-03-07 05:58 PST by Roger Que
Modified: 2023-03-14 06:59 PDT (History)
5 users (show)

See Also:


Attachments
Minimal example (262 bytes, text/html)
2023-03-07 05:58 PST, Roger Que
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Roger Que 2023-03-07 05:58:22 PST
Created attachment 465338 [details]
Minimal example

Steps to reproduce with the example attachment:

1. Make the viewport wider than it is tall, so the text is vertical.
2. Now make the viewport taller than it is wide, so the aspect ratio media query no longer matches.

The text should return to being horizontal, since that is the built-in default style, but instead remains vertical, with the additional problem of the CJK characters now being sideways. This incorrect rendering stays no matter how the viewport is resized.

Explicitly setting `writing-mode: horizontal-tb` outside the media query gives the expected behavior and is a simple workaround.
Comment 1 Radar WebKit Bug Importer 2023-03-14 06:59:31 PDT
<rdar://problem/106700291>