I'm converting an old project and Can someone help me understand I've searched everywhere and can't find a clear answer... I'm experiencing a strange scenario with the ` ` element in Safari 16.4. When I nest another ` ` element inside the first one, the child does not expand properly when clicked. Instead, it just collapses the parent. This scenario doesn't occur in Chrome or Firefox, where everything works as expected. Here’s a simplified version of my code: ```html

HTML `<details>` Element Not Expanding Correctly in Safari 16.4 with Nested Elements

👀 Views: 90 💬 Answers: 1 📅 Created: 2025-08-20

I'm converting an old project and Can someone help me understand I've searched everywhere and can't find a clear answer... I'm experiencing a strange scenario with the `<details>` element in Safari 16.4. When I nest another `<details>` element inside the first one, the child does not expand properly when clicked. Instead, it just collapses the parent. This scenario doesn't occur in Chrome or Firefox, where everything works as expected. Here’s a simplified version of my code: ```html <details> <summary>Main Details</summary> This is some content. <details> <summary>Nested Details</summary> This is nested content. </details> </details> ``` I’ve also tried adding `open` attributes to see if that might help: ```html <details open> <summary>Main Details</summary> This is some content. <details open> <summary>Nested Details</summary> This is nested content. </details> </details> ``` However, that seems to make no difference either. I’ve checked for any CSS that might interfere, but I’m only applying basic styles. The inspector shows that the `open` state is not toggling correctly in Safari, but I need to seem to pinpoint why this is happening. Has anyone else faced this scenario or have insights on how to work around it? This is part of a larger CLI tool I'm building. I've been using Html for about a year now. How would you solve this? Is there a simpler solution I'm overlooking?