Case Insensitive CSS Attribute Selector

Date:

Share post:

CSS selectors never cease to amaze me in how powerful they can be in matching complex patterns. Most of that flexibility is in parent/child/sibling relationships, very seldomly in value matching. Consider my surprise when I learned that CSS allows matching attribute values regardless off case!

Adding a {space}i to the attribute selector brackets will make the attribute value search case insensitive:

/* case sensitive, only matches "example" */
[class=example] {
  background: pink;
}

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

The use cases for this i flag are likely very limited, especially if this flag is knew knowledge for you and you’re used to a standard lower-case standard. A loose CSS classname standard will have and would continue to lead to problems, so use this case insensitivity flag sparingly!

Request Metrics real user monitoring

Source link
spot_img

Related articles

BlueNoroff’s latest campaigns: GhostCall and GhostHire

Introduction Primarily focused on financial gain since its appearance, BlueNoroff (aka. Sapphire Sleet, APT38, Alluring Pisces, Stardust Chollima, and...

ASRock Z790 PG Lightning Motherboard Review: Cheap Z790?

ASRock’s Z790 PG Lightning is a motherboard designed to support 13th and 12th-generation Intel Core processors.Features1. Supports 13th...

Nancy Mace Curses, Berates Confused Cops in Airport Meltdown: Police Report

Nancy Mace, the South Carolina Republican congresswoman, unleashed a tirade against law enforcement at the Charleston International Airport...