WebKit Bugzilla
New
Browse
Search+
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED DUPLICATE of
bug 280637
290915
Details with block-size: 0; and block-size: auto; when :open is not rendered
https://bugs.webkit.org/show_bug.cgi?id=290915
Summary
Details with block-size: 0; and block-size: auto; when :open is not rendered
frankykubo
Reported
2025-04-02 05:50:31 PDT
Overview: I am using details element with summary inside to render accordions. Since iOS 18.4 update, this does not work either in Chrome, or Safari in iPhone. Works okay on android, desktop devices and iPhone 18.3.x iOS devices. Steps to Reproduce: 1. Use this HTML: ```html <details name="faq"> <summary> Summary </summary> <div> DETAIL CONTENTS </div> </details> ``` 2. Use this CSS: ```css @supports(transition-behavior: allow-discrete) { details::details-content { block-size: 0; transition: block-size 0.5s, content-visibility 0.5s; transition-behavior: allow-discrete; } details:open::details-content { block-size: auto; } } ``` 3. Try to open the details element. Expected Results: Details element gets [open] attribute and contents are rendered Actual results: Details element gets [open] attribute, contents are not rendered.
Attachments
Add attachment
proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1
2025-04-09 05:51:13 PDT
<
rdar://problem/148902667
>
Tim Nguyen (:ntim)
Comment 2
2025-04-09 09:27:28 PDT
WebKit doesn't support `:open` currently. You can just replace `details:open::details-content` with `details[open]::details-content` and your code should work. *** This bug has been marked as a duplicate of
bug 280637
***
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug