How to select ids which contain special characters?
css, html
Solution
You can escape special characters with a backslash:
#a\>span\.tex {
color: red;
}
<div id="a>span.tex"> Some funky ID </div>
You can even use backslashes within your ID as long as you escape them with another backslash:
#a\\span\\tex {
color: red;
}
<div id="a\span\tex"> Some funky ID </div>
In fact, lots of crazy strings are valid IDs in HTML5
#\¯\\\_\(\ツ\)\_\/\¯ {
color: red;
}
<div id="¯\_(ツ)_/¯"> ¯\_(ツ)_/¯ - but why would you? </div>
Problem
I'm working with an HTML piece that I cannot modify. One of the ids in the document is: ``` <div id="a>span.tex"> ... </div> ``` This is perfectly valid HTML5 syntax for ids, however, it is not possible to select this id in CSS without having troubles with `>` and `.` characters. How can I select this id in CSS?