So I've been trying to code-golf a JS-free menu bar from my website. The <details> HTML tag proves very useful to have a JS-free foldable menu in mobile mode, however I still need to duplicate the whole menu for desktop mode as I couldn't lock <details> to the open state in desktop mode even with media queries.
The ::details-contents pseudo-element sounds promising though, let's see if it works! It's not widespread yet but just landed in Firefox 143: https://developer.mozilla.org/fr/docs/Web/CSS/::details-content
My bar for stability is at least some time in Firefox ESR, so it won't make it to my website for a year or two. #HTML #CSS #CodeGolf #NoJavaScript




