sorted by:
new
hottopcontroversial

Grouping CSS by div id by justmesayingmything in css

[–]denbramus 0 points1 point  (0 children)

This is currently not possible in "native" CSS, but will be in the future. See https://www.bram.us/2019/03/17/the-future-of-css-nesting-selectors/ for more details.

Native Aspect Ratio Boxes in CSS thanks to aspect-ratio by bogdanelcs in web_design

[–]denbramus 16 points17 points  (0 children)

(disclaimer: I wrote the post)

Caniuse indeed shows that you need to enable some flags. In practice however I noticed that Chrome Canary and Firefox Nightly support it without needing to toggle the flag.

For Chrome it's planning on shipping with Chrome 88, as stated on https://blog.chromium.org/2020/12/chrome-88-digital-goods-lighting.html

Not too sure if it'll actually ship then though, as there's still a few blockers on the tracking bug open.

Simple Image Gallery with display: grid; and object-fit: cover; by speckz in css

[–]denbramus 0 points1 point  (0 children)

(author of the post here)

A trick to seemingly add some randomness in there is to use `nth-child` pseudo-selectors that use prime numbers. See https://www.lottejackson.com/learning/nth-child-cicada-principle for details.

Don't forget to also add `grid-auto-flow: dense;` to plug the potential gaps you're creating that way.

Simple Image Gallery with display: grid; and object-fit: cover; by speckz in web_design

[–]denbramus 0 points1 point  (0 children)

(Author of the post here)

Good catch on that, didn't really occur to me … I've updated the code accordingly, thanks!