KPC
Kevin Powell - Community•2mo ago
Joao

CSS pattern matching

Hey everyone, I'm curious if there's a way to apply pattern matching when selecting elements using CSS. In particular, I want to target anchor elements that contain a particular word in their href attribute, for example: 
a[href="*keyword*"] {}
a[href="*keyword*"] {}
This doesn't work, but the idea is that if the word "keyword" appears in the attribute "href" it would select this element. Is this possible, or is there something equivalent to this?
2 Replies
Joao
Joao•2mo ago
Pff, as usual as soon as I ask online I find the answer right away 😫
Joao
Joao•2mo ago
As per the MDN docs https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors 
a[href*="keyword"] {}
a[href*="keyword"] {}
MDN Web Docs
Attribute selectors - CSS: Cascading Style Sheets | MDN
The CSS attribute selector matches elements based on the element having a given attribute explicitly set, with options for defining an attribute value or substring value match.
Want results from more Discord servers?
Add your server
More Posts
Copied a hover effect but is not the same as the originaloriginal: https://fossheim.io/ button label: collaborate Playground: https://play.tailwindcss.com/Tracking scripts failing on deploymentHi all, Not really something I've messed about with but I keep trying to add tracking scripts to a Help with JS logic to close menu if search is clicked, or vice-versaHello everyone, I am currently working on my own website and have stumbled upon an issue with the fNextjs Multi layout setupIs there a standard way to handle multiple view ui changes in nextjs app dir. I would like to condiPositioning last div at end, when using flex and flex-wrapHi! See screenshot for reference. I'm banging my head against this one. I have a flex container wDark ModeI have a simple question, when the user on his phone or laptop has his dark mode option on ... Is th