#Development #Overviews
Detect at-rule() support in CSS · A handy feature lands in Chromium 148 https://ilo.im/16bf5x

_____
#ModernCSS #W3C #Specification #FeatureDetection #Chrome #Browsers #WebDev #Frontend #CSS

Detect at-rule support in CSS with @supports at-rule(@keyword)

Back in January 2022, I wrote about an exciting new CSS Working Group decision: a function to detect at-rule support using @supports at-rule(@keyword). Fast forward to today, and the CSS Conditional Rules Module Level 5 specification has solidified how this feature works and Chromium (Chrome, Edge, etc.) is about to ship it in Chromium 148!

Bram.us
Introducing the <geolocation> HTML element  |  Blog  |  Chrome for Developers

Discover the new way to request user location data.

Chrome for Developers
A Progressive Enhancement Challenge – Frontend Masters Blog

You want to hide an interactive element that you don't need anymore after JavaScript loads/runs. Can you do it without a

#Development #Overviews
Think you know media queries? · “Get ahead of the curve and start putting them to use.” https://ilo.im/1679ci

_____
#MediaQueries #FeatureDetection #Devices #Browser #Accessibility #WebDev #Frontend #CSS #CssNesting

How much do you really know about media queries? – Frontend Masters Blog

There are a ton more @media queries than

First Look at The Modern attr()

Exploring the modern attr() in CSS

#Development #Releases
More options for styling HTML ‘details’ · All the changes introduced in Chrome 131 https://ilo.im/160qk2

_____
#Widget #Disclosure #Accordion #HTML #Chrome #Browser #FeatureDetection #WebDev #Frontend #CSS

More options for styling <details>  |  Chrome for Developers

You can now set the display type and also style the container for the part that expands and collapses using the new ::details-content pseudo-element.

Chrome for Developers

#Development #Techniques
The undeniable utility of CSS :has · “The CSS :has selector is incredibly powerful.” https://ilo.im/1601qb

_____
#FeatureDetection #EventListener #DarkMode #Framework #Browser #WebDev #Frontend #CSS #CSSinJS #JavaScript

The Undeniable Utility Of CSS :has • Josh W. Comeau

Of all the latest and greatest CSS features, the “:has” pseudo-class wasn’t exactly at the top of my wishlist. Once I started using it, however, I kept discovering incredible things I could do with it. It’s now become a core part of my toolkit! In this blog post, I'll show you some practical real-world problems I solved using “:has”, as well as some wild experiments that blew my mind!

Captured Custom Properties

In a few of my latest CSS experiments and articles, I used one naming pattern for registered custom properties that I think worth highlighting in a separate blog post. This pattern allows us to create a set of generic custom properties, covering a wide set of use cases for computing and storing their values.

#Development #Techniques
Feature detect CSS @property support · Testing browser support for custom property definitions https://ilo.im/15zegz

_____
#FeatureDetection #Browser #BrowserSupport #WebDev #Frontend #CSS #CustomProperty #StyleQuery #SpaceToggle #Workaround

Feature detect CSS @property support

Awaiting browser support for at-rule(), here’s how you do it.

Bram.us

⭐️ New blog post: How to feature detect support for @​property in CSS

https://www.bram.us/2024/07/03/feature-detect-css-property-support/

#css #featuredetection #atproperty

Feature detect CSS @property support

Awaiting browser support for at-rule(), here’s how you do it.

Bram.us