How to target elements using ID or class containing a colon

by

If you have an element you need to target using an ID or class that contains a colon, for example:

<div class="test:1">Content</div>

You’ll soon notice that the standard approach, for example

div.test:1

will not work.

Instead you need to escape the colon character using a backspace.

For example:

div.test\:1 {
    background: pink;
}

Content