Comments on: Pop(over) the Balloons https://css-tricks.com/popover-the-balloons/ Tips, Tricks, and Techniques on using Cascading Style Sheets. Thu, 25 Jul 2024 19:43:21 +0000 hourly 1 https://wordpress.org/?v=6.6.1 By: John Rhea https://css-tricks.com/popover-the-balloons/#comment-1850488 Thu, 25 Jul 2024 19:43:21 +0000 https://css-tricks.com/?p=379281#comment-1850488 In reply to Tom Adler.

Nice work, Tom! The form dialog method never even crossed my mind.

]]> By: Tom Adler https://css-tricks.com/popover-the-balloons/#comment-1850487 Thu, 25 Jul 2024 16:00:57 +0000 https://css-tricks.com/?p=379281#comment-1850487

The only way to close a <dialog> that’s open on page load is with JavaScript. As far as I know, there isn’t a close <button> we can drop in the game that will close a <dialog> that’s open on load.

What worked for me is a form method “dialog”, as in this example:

<dialog open>
<form method=”dialog”>
<button type=”submit”>Close</button>
</form>
</dialog>

]]>