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/youngster/sibling relationships, very seldomly in worth matching. Take into account my shock once I discovered that CSS permits matching attribute values regardless off case!

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

/* case delicate, solely matches "instance" */
[class=example] {
  background: pink;
}

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

The use instances for this i flag are seemingly very restricted, particularly if this flag is knew information for you and also you’re used to a normal lower-case commonplace. A unfastened CSS classname commonplace can have and would proceed to result in issues, so use this case insensitivity flag sparingly!

Designing for Simplicity
Earlier than we get began, it is price me spending a quick second introducing myself to you. My identify is Mark (or @integralist if Twitter occurs to be your communication instrument of alternative) and I presently work for BBC Information in London England as a principal engineer/tech…
Create Namespaced Classes with MooTools
MooTools has at all times gotten a little bit of grief for not inherently utilizing and standardizing namespaced-based JavaScript lessons just like the Dojo Toolkit does. Many builders create their lessons as globals which is mostly frowned up. I principally disagree with that stance, however every to their very own. In any occasion…