Re: [csswg-drafts] [css-contain-3][css-mediaqueries-5] Unified custom queries (#7622)

Initially, I was a bigger fan of the more arbitrary `@custom-query` name over `@custom-media`, as it provided unified support across all query types. However, the more I thought about it, size names typically hold different meanings in different contexts. `@container (--small)` and `@media (--small)` may mean two very different things — small screens vs. small elements.

For that reason, I think something like @romainmenke's suggestion of an at-rule rule like `@prelude` for defining these could make a lot of sense, as an alternative to separate `@custom-media`, `@custom-container`, and `@custom-supports` queries.

One useful addition I'd propose would be the option to explicitly support multiple query types:

Something like this:
```postcss
/* only media */
@query-value --foo {
  syntax: media;
  value: (width >= 768px);
}

/* media and container */
@query-value --foo {
  syntax: media, container;
  value: (width >= 768px);
}
```

I also think it might be better to use query names by their idents _without_ `@`, since those are their names, which can also be used via `media()`, `container()`, etc. when used in `@if` queries— which we should also consider here.

-- 
GitHub Notification of comment by brandonmcconnell
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7622#issuecomment-2964804148 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 12 June 2025 02:19:15 UTC