---
title: Useful CSS
date: 2025-04-01T16:08:20.000Z
updated: 2026-04-14T07:39:45.173Z
url: https://baku89.com/Useful_CSS
---

# Useful CSS

[CSS container queries - CSS | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Containment/Container_queries)

---

- <https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Selectors/:only-child>

---

![](https://wp.baku89.com/wp-content/uploads/2026/04/demo.gif)\
<https://github.com/vyfor/rattles>

[Web UI 実装勉強会 4](/Web_UI_%E5%AE%9F%E8%A3%85%E5%8B%89%E5%BC%B7%E4%BC%9A_4)

newly supported in 18.4\
<https://developer.mozilla.org/en-US/docs/Web/CSS/basic-shape/shape>

```
p {
  --half-leading: calc((1lh - 1em) / 2);
  text-box-trim: trim-both;
}

:is(pre, figure) {
  & + & {
    ...
  }
}
```

<https://x.com/Una/status/2041215307440652396>

![](https://wp.baku89.com/wp-content/uploads/2026/04/Useful20CSS-1775690786347.png)