Thursday 16 July 2020

Irregular-shaped Links with Subgrid

Michelle Barker covers a situation where you need offset rectangles part of a clickable area. The tricky part is having just the rectangles be clickable. That rules out using some parent element and making the whole larger encompassing rectangle clickable, which is a common (but equally tricky) pattern.

Kicking one rectangle outside the bounds of the linked one with absolute positioning could work, but Michelle takes a path here that lays everything out on a grid, then uses pointer-events to get the click areas just right. Feels more robust to me.

Yet another good example of why we need subgrid everywhere, stat.

Direct Link to ArticlePermalink


The post Irregular-shaped Links with Subgrid appeared first on CSS-Tricks.

You can support CSS-Tricks by being an MVP Supporter.



from CSS-Tricks https://ift.tt/2Za8edH
via IFTTT

No comments:

Post a Comment

Passkeys: What the Heck and Why?

These things called  passkeys  sure are making the rounds these days. They were a main attraction at  W3C TPAC 2022 , gained support in  Saf...