Menu

Post image 1
Post image 2
Post image 3
Post image 4
1 / 4
0

Case Insensitive CSS Attribute Selector

David Walsh Blog·David Walsh·about 1 month ago
#4d6TdFfS
Reading 0:00
15s threshold

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! Incredible Demos HTML5 download Attribute I tend to get caught up on the JavaScript side of the HTML5 revolution, and can you blame me?…

Continue reading — create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.

Read More