Tuesday, June 10, 2025
HomeSoftware DevelopmentCase Insensitive CSS Attribute Selector

Case Insensitive CSS Attribute Selector


CSS selectors by no means stop to amaze me in how highly effective they are often in matching advanced patterns. Most of that flexibility is in guardian/little one/sibling relationships, very seldomly in worth matching. Contemplate my shock once I realized that CSS permits matching attribute values regardless off case!

Including a {house}i to the attribute selector brackets will make the attribute worth search case insensitive:

/* case delicate, solely matches "instance" */
(class=instance) {
  background: pink;
}

/* case insensitive, matches "instance", "eXampLe", and many others. */
(class=instance i) {
  background: lightblue;
}

The use circumstances for this i flag are doubtless very restricted, particularly if this flag is knew data for you and also you’re used to an ordinary lower-case customary. A free CSS classname customary could have and would proceed to result in issues, so use this case insensitivity flag sparingly!

Request Metrics real user monitoring
Request Metrics real user monitoring
Request Metrics real user monitoring
Request Metrics real user monitoring
  • 5 HTML5 APIs You Didn’t Know Existed

    5 HTML5 APIs You Didn’t Know Existed

    Once you say or learn “HTML5”, you half count on unique dancers and unicorns to stroll into the room to the tune of “I am Attractive and I Know It.”  Are you able to blame us although?  We watched the elemental APIs stagnate for thus lengthy {that a} primary characteristic…

  • How to Create a RetroPie on Raspberry Pi – Graphical Guide

    How you can Create a RetroPie on Raspberry Pi – Graphical Information

    Right this moment we get to play superb video games on our tremendous powered sport consoles, PCs, VR headsets, and even cell units.  Whereas I get pleasure from enjoying new video games today, I do lengthy for the retro gaming methods I had once I was a child: the unique Nintendo…

  • Chris Coyier’s Favorite CodePen Demos II

    Chris Coyier’s Favourite CodePen Demos II

    Hey everybody! Earlier than we get began, I simply need to say it is rattling onerous to choose this few favorites on CodePen. Not as a result of, as a co-founder of CodePen, I really feel like a dad choosing which child he likes finest (RUDE). However as a result of there may be simply so…

  • Create a Context Menu with Dojo and Dijit

    Create a Context Menu with Dojo and Dijit

    Context menus, utilized in the appropriate kind of net utility, will be invaluable.  They supply shortcut strategies to completely different performance throughout the utility and, with only a proper click on, they’re available.  Dojo’s Dijit frameworks supplies a straightforward approach to create trendy, versatile context…


RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments