Bug 250296

Summary: Summary on <details> has not right margin on RTL
Product: WebKit Reporter: Ahmad Saleem <ahmad.saleem792>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: RESOLVED FIXED    
Severity: Normal CC: bfulgham, ntim, simon.fraser, thorton, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: Unspecified   
OS: Unspecified   

Description Ahmad Saleem 2023-01-08 05:03:11 PST 
Hi Team,

This is two way street:

1) Via Standard Alignment and remove "margin" altogether from html.css:

https://html.spec.whatwg.org/#the-details-and-summary-elements

Chromium does not have this margin anymore - https://source.chromium.org/chromium/chromium/src/+/main:third_party/blink/renderer/core/html/resources/html.css;l=1342?q=html.css

and Firefox as well - https://searchfox.org/mozilla-central/source/layout/style/res/html.css#737

2) Align with Blink Commit following:

Blink Commit - https://src.chromium.org/viewvc/blink?view=revision&revision=176016

Test Case (Not Working) - data:text/html;charset=utf8,<details%20dir="rtl"><summary>Summary</summary>آزمایش</details>
Test Case (Working) - data:text/html;charset=utf8,<details><summary>Summary</summary>آزمایش</details>

WebKit Source - https://github.com/WebKit/WebKit/blob/866813ec2e4eb4f8646237cccfe1ad3ad76f46e1/Source/WebCore/css/html.css#L1366

Just wanted to get input before doing PR.

Thanks!
Comment 1 Tim Nguyen (:ntim) 2023-01-09 02:02:24 PST 
I think we want to keep the margin for now (as we don't implement summary using ::marker & list-style).

Though we should fix the RTL issue you found, by changing `margin-right` to `margin-inline-end`.

Good catch!
Comment 2 Radar WebKit Bug Importer 2023-01-15 05:04:16 PST 
<rdar://problem/104275835>
Comment 3 EWS 2023-02-09 07:32:22 PST 
Committed 260063@main (6a99d8b46741): <https://commits.webkit.org/260063@main>

Reviewed commits have been landed. Closing PR #9834 and removing active labels.