Circles around a square with lines to the middle with CSS anchor and new translation. Try it in latest Canary

https://codepen.io/bigandy/pen/GgZMKYP?editors=1000

With inline if() and style range queries it is possible to have custom style container or media queries. For example

content: if(
style(100vw > var(--width-to-test)): "match";
else: "no-match"
);

or

background-color: if(
style(100cqi >= var(--cq-width-test)): green;
else: red
);

Check this out in Chrome Canary:

https://codepen.io/bigandy/pen/bNVyyJL?editors=0100

#css

@mia @chriscoyier

Dynamic (Container/Media) Query (try out in Chrome Canary!)

https://codepen.io/bigandy/pen/bNVyyJL?editors=0100

with style range queries. Works with both container and media queries.

#css

Woop sibling-count() and sibling-index() being prototyped in Chrome Canary. Check out this demo using it:

https://codepen.io/bigandy/pen/dPyWoVb?editors=0100

v2 of boxes around square

https://codepen.io/bigandy/pen/vYwRyPq?editors=0100

#css #css5 #codepen

Boxes around a square with line to middle

https://codepen.io/bigandy/pen/LYodVMM

#css #codepen #css5

css squares in a square animation with css trig and clamp()

https://codepen.io/bigandy/pen/eYaMNdv?editors=0100

@rachsmith

#css #css5 #codepen

Balloons on strings!

https://codepen.io/bigandy/pen/qBGxgLL?editors=0010

#css #css5 #codepen

CSS Balloons on string

#css #css5 #codepen

https://codepen.io/bigandy/pen/VwOQWXj?editors=0100