Olliew - Network

https://fullystacked.net/a-better-dialog/

https://fullystacked.net/a-better-dialog/

https://fullystacked.net/popover-vs-dialog/

https://fullystacked.net/popover-vs-dialog/

Having a discussion about using the popover attribute on the dialog element for non-modal dialogs...

Having a discussion about using the popover attribute on the dialog element for non-modal dialogs https://github.com/whatwg/html/issues/11105

Styling the icon of a HTML summary element:https://fullystacked.net/styling-details-summary

Styling the icon of a HTML summary element:

https://fullystacked.net/styling-details-summary

This is an interesting suggestion for DOM elements being able to request their own scoped stylesheet....

This is an interesting suggestion for DOM elements being able to request their own scoped stylesheet. https://github.com/MicrosoftEdge/MSEdgeExplainers/issues/900

How bad is the performance hit of putting <style> or <link rel="stylesheet"> elements within the body rather than the...

How bad is the performance hit of putting <style> or <link rel="stylesheet"> elements within the body rather than the head?

@bramus I'm reasonably sure scrollbar-color is not supported in Safari yet, but scrollbar-gutter and scrollbar-width...

@bramus I'm reasonably sure scrollbar-color is not supported in Safari yet, but scrollbar-gutter and scrollbar-width are.
https://web.dev/blog/baseline-scrollbar-props

What determines whether background-clip gets applied to a background-color rather than only to a background-image? The fact that the...

What determines whether background-clip gets applied to a background-color rather than only to a background-image? The fact that the following works to preserve the background-color seems weird imo.

Are there many compelling use cases for inert other than modal dialogs? I suppose its useful for anytime something is in the DOM, positioned...

Are there many compelling use cases for inert other than modal dialogs?

I suppose its useful for anytime something is in the DOM, positioned out of view but not set to display: none (slide out panels, non-current carousel slides (if the slides have interactive content in them.)...)

Is there anything else?

https://fed.brid.gy/r/https://bsky.app/profile/did:plc:cs3zn3kikj5kwzljlvyr55sg/post/3lhmoeeylha2c

@kizu Do you know what would be the best way to reposition the little triangle when the anchor position fallback changes?

@kizu Do you know what would be the best way to reposition the little triangle when the anchor position fallback changes?

What would be the best approach to implement something like this with the popover API? The button being highlighted isn't itself a...

What would be the best approach to implement something like this with the popover API? The button being highlighted isn't itself a dialog or popover, so I guess there's no way for it to show above a ::backdrop?

All CSS resets should add this code because the default behaviour is annoying and I almost never want to center a popover: [popover] { ...

All CSS resets should add this code because the default behaviour is annoying and I almost never want to center a popover:

[popover] {
inset: auto;
margin: 0;
}

Combining currentcolor with relative color syntaxhttps://fullystacked.net/currentcolor-with-relative-color-syntax/

Combining currentcolor with relative color syntax
https://fullystacked.net/currentcolor-with-relative-color-syntax/

TIL Safari supports WebM and AV1, but does not support the AV1 codec when used in a WebM container 😞

TIL Safari supports WebM and AV1, but does not support the AV1 codec when used in a WebM container 😞

I wish Chromium had an equivalent of the WebKit and Mozilla standards positions repos.Do they plan to support background-clip:...

I wish Chromium had an equivalent of the WebKit and Mozilla standards positions repos.

Do they plan to support background-clip: border-area?

https://github.com/WebKit/standards-positions
https://github.com/mozilla/standards-positions

How do you vertically centre a custom CSS ::marker?

How do you vertically centre a custom CSS ::marker?

I made a JavaScript-free spoiler revealer https://codepen.io/cssgrid/pen/myboyLz(Chrome only for now...)

I made a JavaScript-free spoiler revealer https://codepen.io/cssgrid/pen/myboyLz

(Chrome only for now...)

A new CSS pseudo-class appears. https://fullystacked.net/open-pseudo-class/

A new CSS pseudo-class appears.
https://fullystacked.net/open-pseudo-class/

Not the most exciting release but Safari 18.3 does fix a popover bug...

Not the most exciting release but Safari 18.3 does fix a popover bug https://webkit.org/blog/16439/webkit-features-in-safari-18-3/#:~:text=Fixed%20touching%20or%20clicking%20outside%20of%20the%20popover%20not%20closing%20it

I hadn't realised how buggy animated AVIF could be in Safari. It's basically unusable....

I hadn't realised how buggy animated AVIF could be in Safari. It's basically unusable. https://jakearchibald.com/2024/video-with-transparency/#it-doesnt-work-in-safari