Modal/Dialog Form tag not supported within article tag

[78wesley]

Describe the issue

When I want to add a <form> within <article> at a <dialog> tag the layout is not of the <header> or <footer> is not there, Because the CSS only looks for article>header, article>footer.

Current Behavior

It is currently not possible to have a modal where the save button is in the footer and still interact with the <form>.

Expected Behavior

The <form> needs to not interact with the styling. It needs to pass through.

Reproduction URL

Normal dialog: https://codepen.io/78wesley/pen/yLmYgPL
With form tag dialog: https://codepen.io/78wesley/pen/ZEgbLvG

Environment

OS: Windows 11
Browser: Brave Version 1.70.119 Chromium: 129.0.6668.70 (Official Build) (64-bit)]
Pico CSS is: v2.0.6 with (https://unpkg.com/@picocss/pico@latest/css/pico.classless.min.css)

[TomFaulkner]

I found the same issue. Without overrides I currently have to choose between a funny looking form modal or htmx happily submitting empty required fields.

[ronny-rentner]

I've had the same problem and had to copy Pico's styles for header and footer.