5

In the HTML code there is a div like:

<div id="xxx.yyy">...</div>

I want to specify the style in a css file. How can I get a reference to this div? The following does not seem to work:

#xxx.yyy {

}

Thanks

znat
  • 13,144
  • 17
  • 71
  • 106
  • because that's calling the class yyy as a companion to the id xxx. Like
    . Also, this is a duplicate. http://stackoverflow.com/questions/605630/how-to-select-html-nodes-by-id-with-jquery-when-the-id-contains-a-dot
     – Kai Qing Oct 03 '12 at 00:56

2 Answers2

8
#xxx\.yyy {

}

Should do the trick. No harm done in using dots in CSS id names

Musa
  • 96,336
  • 17
  • 118
  • 137
Bruno Vieira
  • 3,884
  • 1
  • 23
  • 35
  • 2
    No harm? Having to escape them sucks, especially when there are separators like `_` and `-` which work fine. – alex Oct 03 '12 at 01:25
  • Well, one can simply not use dots or underline or hyphen. Some choices come with a price and I find that a single \ does not hurt anyone – Bruno Vieira Oct 03 '12 at 01:28
  • check out my answer... you don't *have* to escape to select: http://stackoverflow.com/a/12700730/196921 – Hristo Oct 03 '12 at 01:34
  • Well, it's a standard procedure. Which browser are you using to test your code? Are you sure you were not viewing a cached page? – Bruno Vieira Oct 03 '12 at 12:56
6

You could also do something like this...

​div[id="xxx.yyy"] {
    /* your styles here */
}​​​​​​

The spec says it all: http://www.w3.org/TR/CSS21/syndata.html#value-def-identifier

jsFiddle: http://jsfiddle.net/UnsungHero97/mjGzQ/

Hristo
  • 45,559
  • 65
  • 163
  • 230