title: CSS selector with period in ID
body: <p>The HTML spec allows for periods (.) in an id:</p>
  
  <p><code>&lt;img id="some.id" /&gt;</code></p>
  
  <p>However, using a CSS ID selector rule will <em>not</em> match correctly:</p>
  
  <p><code>#some.id { color: #f00; }</code></p>
  
  <p>The CSS spec for <a href="http://www.w3.org/TR/CSS2/selector.html#id-selectors" rel="noreferrer">ID Selectors</a> does not mention this case. So I assume it is using the combination of a tag name and <a href="http://www.w3.org/TR/CSS2/selector.html#class-html" rel="noreferrer">class selector</a>? For example, a CSS rule of <code>a.className</code> would apply to all anchor tags (<code>&lt;a&gt;</code>) with a class name of <code>className</code>, like <code>&lt;a class="className"&gt;&lt;/a&gt;</code>.</p>
  
  <p>Is it possible to have an external CSS file rule that references an HTML element by its id that has a period in it?</p>
  
  <p>I expect not since the CSS spec specifies that a CSS "<a href="http://www.w3.org/TR/CSS2/syndata.html#value-def-identifier" rel="noreferrer">identifier</a>" does not include the period as a valid character. So is this a fundamental mismatch between HTML and CSS specs? Is my only alternative to use a different type of CSS selection? Can anyone smarter than I confirm or deny this?</p>
  
  <p>(I would remove the period from the HTML id attribute to simplify things, but it is a system-generated id, so I don't have the ability to change it in this case.)</p>